What is the jam stack?

JAMstack

Let us explain what the ‘JAM stack’ is for people that, maybe, need to understand it better. So basically, the JAMstack itself is mostly a name for a way of approaching the architecture of building web projects.

It stands for JavaScript, APIs, and Markup. To simplify, it is called JAM or the JAM Stack.

It’s based on this idea that instead of having sort of a big dynamic application that runs every time a request comes in – and then generates HTML and sends it back to the browser – you start really separating and decoupling the front-end presentation layer from the different dynamic functionalities. Typically, a lot of pre-built Markup is used as a front-end presentation layer. In addition, JavaScript is (sort of) the main runtime engines, which talks to all of these different APIs & services.

Simply put, the basic things, are in markup and form the steady base. That steady base is enriched with JavaScript APIs. This adds things like, shopping carts, and just anything that’s a dynamic functionality. So if you have an e-commerce store, you might try to generate all the product pages upfront and have them ready if a client clicks on one of them. These pages ‘live’ directly on the CDN, which makes the load time as fast as it can possibly be.

There’s just no way at the moment to get make them even faster.

Need for an API

People will browse very, very quickly and they’ll have a great experience. Once they start putting stuff in a cart, a JavaScript component activates to manage that specific component. Once the visitor clicks on the buy button, ‘obviously’ something needs to happen on the server somewhere. that’s where you would typically use an API or an API call. Whether it’s Stripe, a more fully-fledged Commerce Layer, or even your own home-built serverless function talking to Stripe, you end up having to use this API endpoint. It gets involved when there’s a real ‘state change’ or action required.

Serverless

Because of this kind of pre-built, the application or site can be ‘serverless’. Of course, this does not mean the application will spin up without a server. It simply means that the code does not require a server 24/7 and only ‘calls’ on the server when necessary. Therefore, you as a site owner or developer, don’t have to worry about building and maintaining the stability of the application. Simply put, you just serve it. Even with something as complex as hosting the site, it is that simple. To strengthen and quicken this, a content delivery network can be used. These are geographically spread proxy servers on the internet stored in data centers. The CDN helps to store and deliver content fast, or better said, very fast.

To summarize, make sure that everything is pre-built and ready on a CDN as performant as possible. In that scenario, you (sort of) end up with the best of both worlds.

It’s a complicated system, but this should’ve helped you a bit.