Writing

Markdown Tables Example

24/07/2025

3 minutes read

Share article

Introduction

Tables are a powerful way to organize and display data in your markdown content. This article demonstrates various table formats and how they render in your portfolio.

Basic Table

Here's a simple table showing programming languages and their characteristics:

LanguageTypeYearPopularity
JavaScriptDynamic1995Very High
TypeScriptStatic2012High
PythonDynamic1991Very High
RustStatic2010Growing
GoStatic2009High

Table with Alignment

You can control text alignment in table columns:

Left AlignedCenter AlignedRight Aligned
LeftCenterRight
DataDataData
ExampleExampleExample

Project Comparison Table

Project NameTechnology StackStatusGitHub Stars
PortfolioNuxt 3, Vue 3✅ Live42
Blog EngineNext.js, React🚧 Dev18
CLI ToolRust, Clap✅ Live127
Mobile AppReact Native📋 Plan-

Table with Code

CommandDescriptionExample
npm installInstall dependenciesnpm install vue
npm run devStart development servernpm run dev
npm run buildBuild for productionnpm run build

Performance Metrics Table

MetricBefore OptimizationAfter OptimizationImprovement
Load Time3.2s1.1s🚀 65% faster
Bundle Size2.1MB850KB📦 60% smaller
Lighthouse Score7298⭐ 36% better
Core Web VitalsPoorGood✅ Excellent

Conclusion

Tables provide an excellent way to present structured data in your content. The styling applied ensures they look great in both light and dark modes, with proper hover effects and responsive behavior.

Try creating your own tables using the markdown syntax shown above!