What is JAMstack?

JAMstack stands for JavaScript, APIs, and Markup. It’s a modern web architecture focused on performance, security, and scalability.

Core Ideas

• Pre-rendered Markup: Pages are generated at build time for speed and reliability.
• APIs: Server-side functionality is consumed via APIs (serverless or traditional).
• JavaScript: Enhances interactivity on the client when needed.

Benefits

• Faster load times and better Lighthouse scores
• Improved security surface (no always-on server)
• Lower hosting costs, simpler scaling
• Versioned, reproducible builds via CI

Architecture (at a glance)

Authoring → Markdown/Nunjucks → Static Site Generator (e.g., Eleventy, Hugo) → Build pipeline (CI) → CDN (e.g., Netlify, Vercel) → Optional APIs (serverless functions, external services).

When to use JAMstack

• Content-focused sites: blogs, docs, marketing, portfolios.
• Sites where reliability, speed, and security matter.
• Teams who prefer Git-based workflows and CI.

Common tooling

• Generators: Eleventy, Hugo
• Styling: Tailwind CSS
• Hosting/CDN: Netlify, Vercel
• CMS (optional): Netlify CMS, Decap, Sanity

Deploying

1. Push your repo to GitHub.
2. Connect to Netlify or Vercel.
3. Set a build command (e.g., npm run build) and publish directory (e.g., _site/ for Eleventy).

Further reading

• jamstack.org
• Eleventy docs
• Hugo docs
• Netlify blog