What you'll build
Your own static blog with Astro. You'll be able to write posts in Markdown, have a main page with articles sorted by date, and individual pages for each post. The site will be ultra fast, secure, and free to host on Vercel or GitHub Pages. It's the perfect way to document what you learn and build your online presence.
Popular options
| Tool | Language | Ideal for |
|---|---|---|
| Astro | JS | Content + components |
| Hugo | Go | Extreme speed |
| Jekyll | Ruby | Native GitHub Pages |
| 11ty | JS | Simplicity |
Step 1: Ask an AI for the setup
I need a static blog with Astro that:
- Has posts in Markdown
- Shows list of posts with date
- Has individual page per post
- Uses Tailwind CSS
- Has dark mode
- Is deployable on Vercel
Give me the commands and structure.
Step 2: Create the project
npm create astro@latest my-blog
cd my-blog
npm run dev
Typical structure
my-blog/
├── src/
│ ├── content/
│ │ └── posts/
│ │ ├── first-post.md
│ │ └── second-post.md
│ ├── layouts/
│ │ └── PostLayout.astro
│ └── pages/
│ ├── index.astro
│ └── posts/[slug].astro
└── astro.config.mjs
Post format
---
title: "My first post"
date: 2024-01-15
description: "What I learned today"
tags: ["javascript", "learning"]
---
# My first post
Content in **Markdown**...
Publish
# Vercel (automatic from GitHub)
npm run build
# Push to GitHub, connect with Vercel
Next step
→ Form with Validation — Secure inputs