JavaScript, APIs, and Markup
JAMstack is a modern web architecture based on JavaScript, APIs, and Markup — pre-rendering pages as static files served via CDN, with dynamic functionality via APIs and client-side JavaScript.
The JAMstack Philosophy
Traditional web (LAMP stack):
- Server renders pages on request
- Database queries for every page load
- Slow, hard to scale, security vulnerabilities
JAMstack:
- Build step pre-generates HTML files
- Serve static files from CDN (blazing fast)
- Dynamic features via APIs (Stripe, Contentful, Auth0)
- No servers to manage, infinite scale, secure by default
The Stack
J = JavaScript: React, Vue, Svelte (client-side interactivity)
A = APIs: Headless CMS (Contentful, Sanity), serverless functions (Netlify, Vercel)
M = Markup: Static HTML generated at build time (Gatsby, Next.js, Eleventy, Astro)
Popular Tools
Static Site Generators:
- Gatsby (2015): React-based, GraphQL data layer
- Next.js (2016): React framework, supports SSR + SSG
- Eleventy (2018): Simple, fast, flexible
- Astro (2021): Ships zero JS by default, partial hydration
Hosting/Deployment:
- Netlify (2014): Pioneered JAMstack term, one-click deploys
- Vercel (2015): Next.js creators, edge network
- Cloudflare Pages (2021): Free, fast, global CDN
Headless CMS:
- Contentful: API-first content platform
- Sanity: Real-time collaborative CMS
- Strapi: Open-source headless CMS
Benefits
- Performance: Pre-built pages = instant loads
- Security: No database/server = no SQL injection, DDoS harder
- Scalability: CDN handles traffic spikes automatically
- Developer Experience: Modern tools, Git-based workflows
- Cost: Static hosting is cheap/free (Netlify, Vercel, GitHub Pages)
Limitations
- Not for everything: Real-time apps, user-generated content sites harder
- Build times: Large sites (10K+ pages) can take minutes to rebuild
- Complexity: More moving pieces (CMS, API, build process) vs monolith
2023 Evolution
Term “JAMstack” less used, architecture absorbed into mainstream. Next.js, Astro dominate. Focus shifted to “edge computing” and “partial hydration.”
Sources: JAMstack.org, Netlify Blog