JAMStack stands for JavaScript API Markup
Intro
You’ve probably heard a lot about JAMStack lately and wondering what is it, exactly?
It’s a new web development stack built on top of three components that are
- JavaScript (J),
- APIs (A), and
- Markup (M)
JAMStack is pre-rendered sites or apps with high-speed performance that are securely delivered via CDN, excluding the need of web servers.
What Isn’t a JAMStack?
A monolithic web application that is tightly coupled between front end and backend is not a JAMStack. Popular example of website development platform like WordPress, Drupal, Ghost, OctoberCMS etc.
Any single page application that render views on server at runtime are not part JAMStack.
Why JAMStack?
Better Performance
When it comes to high traffic and scaling website or web app, JAMStack scales without any issue, due to its pre-built static files. The cost of hosting a JAMStack app is lower compared to other stack or you might found lot of website hosting for free.
Generated Markup and image assets can be served over CDN or Server less Host.
JavaScript Client side rendering makes user experience far better.
When it comes to security, you don’t have to worry about backend vulnerabilities. Server side features is abstracted by APIs.
Better developer experience
Front End Developer can focus on functionality without worrying about monolithic architecure. This means quicker and more focused development.
Scalability
If product goes viral and has many active users, the CDN seamlessly compensates.
Atomic deploys make it easier to mange multiple version of the application.
Now zero wait time for server to clear the cache. Your CDN invalidates the cache once you upload your build and it become live in an instant
Version controlled codebase makes it easier to track changes and collaborate
Automated builds, Server builds the project, updates the CDNs and the site is live.
Work flow
- Develop
- Version Control
- Automated build
- Static Assets
- Atomic Deploy
- Pre-render & invalidate cache
- Updates CDN
The Rise of JAMStack
A modern web development architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup
Mathias Biilmann (CEO & Co-founder of Netlify).
Deployment
Netlify, Zeit, Github Pages, Stackbit
Dynamic Parts
Custom Functions: you can also abstract your own functions into reusable APIs. For this you can use AWS Lambda functions or Netlify Functions.
Custom Data
As you add features to you site, you may want to store user profiles, shopping cart data, game levels, or other dynamic data. Get started for free with FaunaDB Serverless GraphQL.
Comments
Typically used in blogs. JAMStack products have dynamic comment sections.
Forms
A great way to interact with your audience
E-commerce
Setting up an online store on the JAMStack has never been easier
Search
Rely on third party services to integrate a search functionality.
CMS
JAMStack sites can also be controlled via a Content Management System, these are typically known as Headless CMS. Once a change in the CMS is made, a new build of your site will be triggered and then deployed as static assets.
Aotomot, Netlify CMS, Contentful, Headless WordPress, Ghost, Strapi, Forestry, Sanity.io
