Markdown blog engine with RSS + sitemap

Resume bullet (when finished)

“Built a static markdown-driven blog engine with full RSS 2.0 feed, sitemap.xml, syntax-highlighted code blocks, dark theme, and a 95+ Lighthouse score; deployed to Vercel with under 30KB of JS shipped to the client.”

Locked tech stack

No "choose your language" — analysis paralysis kills completion. Follow the stack to the letter on your first build.

Milestones (7 · ~15h)

1. M1~2h

   Hello-blog: render one .md file as HTML

   FastAPI app loads `posts/hello.md`, converts to HTML via markdown-it-py, renders Jinja2 layout. Visible at /.

   CHECK BEFORE MOVING ON:

   • Why parse markdown server-side instead of client-side?
   • Where does the Jinja2 template separate concerns from the route?
   $ git commit -m "feat: render single markdown post via FastAPI + Jinja2"
2. M2~2h

   Frontmatter + post index

   Parse YAML frontmatter (title, date, slug, tags). List view at / shows all posts sorted by date.

   CHECK BEFORE MOVING ON:

   • What's frontmatter and why is it the right place for metadata?
   • Why not use a database for 3 posts?
   $ git commit -m "feat(content): frontmatter parsing + index page"
3. M3~2h

   Syntax highlighting via Pygments

   Fenced code blocks (```python) render with Pygments-generated HTML + CSS theme.

   CHECK BEFORE MOVING ON:

   • Why server-side highlight (Pygments) over client-side (highlight.js)?
   • What's the cost — page size or build time — and how do you mitigate?
   $ git commit -m "feat(content): Pygments syntax highlighting"
4. M4~2h

   RSS 2.0 feed at /feed.xml

   Standards-compliant RSS — `application/rss+xml` content type, valid pubDate, GUID per post.

   CHECK BEFORE MOVING ON:

   • Why does GUID matter for a feed reader?
   • What's the difference between RSS 2.0 and Atom?
   $ git commit -m "feat(seo): RSS 2.0 feed"
5. M5~2h

   sitemap.xml + OG cards

   Sitemap with lastmod per post. Per-post og:title, og:description, og:image. Validated at validator.w3.org/feed.

   CHECK BEFORE MOVING ON:

   • Why does Google need a sitemap when it can crawl your links?
   • What 3 OG tags are non-negotiable for unfurl quality?
   $ git commit -m "feat(seo): sitemap + OG tags"
6. M6~3h

   Lighthouse 95+ pass

   All 4 categories ≥ 95 on the production deploy. Document any compromises.

   CHECK BEFORE MOVING ON:

   • Which Lighthouse category usually trips up Python web apps?
   • What's the easiest perf win you found?
   $ git commit -m "perf: Lighthouse 95+ across all categories"
7. M7~2h

   Deploy to Vercel

   vercel.json with Python serverless function, build verified on a clean clone, prod URL in README.

   CHECK BEFORE MOVING ON:

   • Why is Vercel's Python runtime cold-start slower than Node's?
   • What's a 'cold start' anyway?
   $ git commit -m "ops: Vercel deploy + production URL"

60-second demo storyboard

What you say in the recruiter screen when they ask "tell me about your latest project." Practice it out loud.

1. 0-5s: 'I built a static markdown blog engine that scores 95+ on Lighthouse.'
2. 5-20s: Live demo — view the deployed blog, scroll the index, open a post.
3. 20-35s: View source on a post page — show RSS feed link, OG tags, sitemap.
4. 35-50s: Lighthouse audit live in front of the recruiter (or screenshot if they're rushed).
5. 50-60s: Repo link + one architectural decision (e.g. 'why I used FastAPI for a static-ish site').

STAR talking points for behavioral round

Production references — how grown-up systems do this

Self-review rubric (before you claim done)