JamStack: The new way to serve modern web applications.

JamStack: The new way to serve modern web applications.

JavaScript + API + Markup = JAMStack

Sources: Dinarys

What is JAMStack?

“A modern web development architecture based on client-side JavaScript, reusable APIs, and pre-built Markup” — Mathias Biilmann (CEO & Co-founder of Netlify).

JavaScript, API and Markup = JAMStack

JavaScript in the browser as the runtime

JavaScript handles the dynamic programming during the request and response cycle, running on the client side. This could be JavaScript frameworks, libraries or vanilla.

Reusable HTTP APIs rather than app-specific databases

The server-side processes and database actions are abstracted into reusable APIs, accessed over an HTTP with JavaScript. These APIs could be custom-built or maybe leveraged on a third-party service.

Prebuilt markup as the delivery mechanism

The markup is usually templates and pre-built during deployment time using a static site generator or builds tools for web applications.

Types of JAMstack Projects

  • HTML Content

  • Content from a CMS

  • Web Applications

  • Large Web Properties

HTML Content

The simplest JAMstack sites are pure static sites, they comprise a folder with HTML, JavaScript, CSS, images and font files.

Content from a CMS

Headless CMS makes it possible for us to think of content editing UIs as completely separate from the frameworks and tools used in rendering and delivering our web apps.

Web Applications

Modern Single Page Applications (SPAs) front-end and back-end are being completely separated. A whole new generation of front-end build tools emerged to make working with the front end smooth after the initial setup and configurations.

Large Web Properties

For pre-building markups, the build and deployment cycle becomes too long to allow for a viable workflow. However, build tools have become fast these days, with a static-site generator like Hugo being able to process thousands of pages a second and provide much faster build cycles.

Why JAMstack?

  • Fastest possible performance

  • Security

  • Cost

  • Scalable

  • Good SEO

RESOURCES

Jamstack | JavaScript, APIs, and Markup
Edit description
jamstack.org

Learn JAMstack in Free 3.5 Hour Video Course - Demos & Examples
*In the 5 years since the term " JAMstack " was coined by Netlify co-founders Matt Biilmann and Chris Bach, it has grown…*
netlify.com