DEV Community

Cover image for This is my JAMstack
Carmen Salas
Carmen Salas

Posted on

This is my JAMstack

What is JAMstack?

Let’s talk about an approach to building applications that may be more frontend developer-friendly. JAMstack is a concept or approach for building out applications if you want to create a website that does not require creating a server or database.

What is the JAMstack approach?

JAMstack stands for JavaScript, API, Markup. Typically when building out an application most developers are used to a Mololithinc structure. In a monolithic structure, the front end is tightly coupled with the backend. When the client makes a request, it hits a server, which pulls data from a database, that then produces HTML to render and then sends that back to the client. There is no need to build out the HTML page for every page request the client makes in the JAMstack structure.

The main concept behind JAMstack is to decouple the frontend from the backend and free the frontend from servers sp that it can be deployed directly to a CDN
With a JAMstack approach, the frontend pages are built before it is sent to the client through a build process before being deployed.
The JavaScript is the request/response cycle on the client’s side.
The M in JAMstack stands for Markup. The markup are the static pages that are prebuilt and they are put in a CDN. So, if the client requests a page, there is no need to hit a server to build out the HTML, it instead will fetch the HTML from a CDN which has been pre-built.
The A in JAMstack is for the use of third party APIs which provide the dynamic content to the page. As well as querying requests to an API from the frontend before the pages are built to then deploy.

So, what are the benefits of using the JAMstack approach?

There are lots of benefits to this approach to building an application.
The first is that your website will be faster since it does not have to hit a server and the pages are prebuilt. Typically when you host your applications on servers with databases, users are making requests to the same servers in limited locations, which can cause traffic jams (pun intended). Instead, in JAMstack, you are deploying an application globally through the use of CDNs. A CDN (Content Delivery Network) distributes the static content, like the static content built in a JAMstack approach and then serves them to the users in a location closer to them. This also means higher security since there are no servers or databases in your application that are at risk. Because your pages are pre-built the performance of your application skyrockets as well.

Lastly, this makes the process of developing a site much easier, since there is no need to manage and build servers or databases. You can manage the content of your page through version control such as GIT. This approach to building an application makes sense if you have an application that does not require a full database and has content that can be built beforehand using markup.

Cover by Markus Spiske on Unsplash.

Latest comments (9)

Collapse
 
agilitycms_76 profile image
Agility CMS

Great article, thank you! Yes to this "Lastly, this makes the process of developing a site much easier, since there is no need to manage and build servers or databases. "Lastly, this makes the process of developing a site much easier, since there is no need to manage and build servers or databases. Check out out JAMstack for Beginners ebook for more info and inspiration! agilitycms71084.ac-page.com/ebook-...

Collapse
 
dinarysgmbh profile image
DinarysGmbH

Thanks for sharing, Carmen!
JAM Stack Architecture is becoming more and more popular in development beyond the development of content management systems.
JAM The advantages and fundamental differences between traditional dynamic sites and JAM solutions are described in more detail here dinarys.com/blog/jamstack-for-mode...

Collapse
 
mzaini30 profile image
Zen

Markdown or Markup (HTML and CSS)?

Collapse
 
cs_carms profile image
Carmen Salas

Markup

Collapse
 
fquirin profile image
Florian Quirin

One could argue that a CDN is still a bunch of servers and that the APIs will usually still require a database and can limit the "speed" of your page but I guess that doesn't change the core message too much 😉

Collapse
 
kant312 profile image
Quentin Delcourt

Small precision: the M stands for Markup, since those systems allow for other languages than Markdown (I found more info about the alternatives here: remotesynthesis.com/blog/m-is-for-... ).
So far I never needed anything else than Markdown to do the job 🙂

Collapse
 
eduplessis profile image
Edouard Duplessis

So yeah .... It's
JavaScript
API
Markup

Collapse
 
eduplessis profile image
Edouard Duplessis

And the markdown is part of the API of jamstack because the markdown is often use as the data on build time.

Collapse
 
starpebble profile image
starpebble

Isn't Markdown interesting? The JAMStack is shrinking the size of our websites. Tinier is better.