What is JAMstack: An Intro

Guy Romelle Magayano — Wed, 19 Feb 2020 02:46:07 +0000

To simply put, JAMstack refers to a new way or method of building websites and apps that delivers better performance, higher security, lower scaling cost and a better developer experience. Furthermore, according to its website, JAMstack is a modern web development architecture based on client-side Javascript, reusable APIs, and prebuilt Markup - pretty straightforward, if you ask me.

A website built with JAMstack has the following characteristics:

Must have Javascript running entirely on the client for request/response cycle. This could mean utilising any front-end framework, library, or just plain JavaScript.
Must have APIs integrated into the website for all server-side processes or database actions. Such APIs can be custom-built or leverage third-party services (some are free or subscription-based).
Must have Markup, specifically templated markup, that should be prebuilt at deploy time. This is usually established by site generators for content sites or a build tool for web apps.

On the other hand, a website is not considered a JAMstack when it relies on a tight integration between a client and server.

A site built on a CMS (Content Management System) which has server-side features. Such CMS include WordPress, Drupal, Joomla, or even SquareSpace.
A single page app that utilises isomorphic rendering to build views on the server at runtime.
A monolithic server-run web app that depends on backend language such as Ruby, PHP, Node, etc.

Now that you know the differences of a JAMstack website and those that aren't, the question is, why should we care about JAMstack in the first place? Well, here's why:

Better Performance
Cheaper, Easier Scaling
Higher Security
Better Developer Experience

Performance is usually at the top priority list of most developers when building websites/apps. Thus, with JAMstack, websites are not only generated at deploy time but are loaded blazingly-fast over a CDN (Content Delivery Network).

Website/app costs are a big deal to most clients, that we developers know and understandingly consider every time. Thus, when the scale of such projects grow, we developers often prefer a cheaper hosting solution that quickly deploys the website/app but compromises on the maintainability - in terms of overall features - of the website/app long term. With JAMstack, scaling options are more flexible, cost-efficient and simpler to maintain. When deploying a JAMstack website/app, its only a matter of serving files in more places. CDNs are great options for this setup and often include scaling in ALL of their pricing options.

Regarding the security of a website/app often depends on many factors like the hosting features, server configurations, and how the website was developed. With JAMstack, server-side processes are abstracted into microservice APIs which results in a more robust website/app against random attacks. In addition to, developers could leverage the expertise of third-party services to enhance the security features of your website/app.

Finally, with JAMstack, developers can now focus on more important things on the development - for instance, developing new functionalities or debug critical errors in a targeted area of control. JAMstack allows for a loose coupling and separation of controls which eliminates the need for developers to maintain a separate stack for content/marketing and the overall functionalities of the website/app.

Learn more about the JAMstack through this website. For best practices, check this website. Still curious? Great resources can be found here.

DEV Community: Guy Romelle Magayano

What is JAMstack: An Intro