What is JAMstack?

JAMstack is a term that describes a modern web development architecture based on JavaScript, APIs and Markup (JAM). JAMstack isn’t a specific technology, but rather a different way of building apps and websites.

Instead of using a traditional CMS or site builder, a JAMstack site splits up the code (JavaScript), the site infrastructure (APIs) and the content (Markup). These will all be handled in a decoupled architecture and with a clear split between server and client-side.

Most JAMstack sites will be fully static sites in HTML built with a static site generator. This will result in a very simple and clean codebase, which means very low requirements to your hosting.

To put content on the website, you'll use Markdown and make it available for your frontend via APIs. This can either be done by writing your content in a code editor or by using a headless CMS to create and manage your content. 

Lastly you'll need to design the website using JavaScript. This will be the code that tells your website how to present the content in a nice way. By using JavaScript you'll be handling it on the client instead of the server. This decreases the server requirements and can help improve performance dramatically.

 

 

What is a static site generator?

The number one thing that static site generators have in common is that unlike conventional website builders they don’t depend on a web server. Instead of building each page on demand, a static site generator generates all the pages of the site when there’s actually changes to the site. This means a visitor doesn't have to wait for the database to create a page before loading it. Instead the page will be ready right when the visitor lands on the page and the client will be doing the heavy lifting. This makes caching much easier and the site faster by utilizing a content delivery network and client-side processing instead of relying on a server. 

 

JAMstack vs. CMS

The main difference between a JAMstack website and a website built with a content management system is how tightly the content, code and design is.

With a CMS you'll be handling everything in the same system. You'll have a backend interface where your developers will be handling all of the code and design templates. Your content will also be created, updated and managed from a backend interface and it will all be stored in databases on a server. Once a page on the website is visited, it will be assembled by the server and delivered to the visitor and the page is shown.

With a JAMstack site you're decoupling all of these parts and handling them separately. This decreases any dependancy and gives you the freedom to choose your own tech stack. One key difference is how pages are generated for a website visitor. With a JAMstack site, you're almost entirely relying on the client-side instead of the server-side. You pages will be stored in a cache - typically using a CDN - as HTML and JavaScript, which will be ready and waiting for the visitor to come by. Once a visitor visits your page, it'll all be ready for it to handle - without having to go back to the server and assemble it.

 

What are the pros and cons of using JAMstack?

 

Pros of using JAMstack

  • It can be blazing fast. Since the JAMstack relies less on a server or database, it'll often load very fast for the page visitor. By effectively caching all of your content on a CDN and focusing on a clean front-end code you avoid a lot of the processes normally involved in loading a web page.
  • The website is secure. The decoupling of the backend and frontend effectively means that any security flaws that might be exploited in the frontend code won't mean a security breach in your backend application. These are separated by an API and will mostly be read-only. At the same time you're much less reliant on a database, which minimizes the potential issues that can occur.
  • Scaling is easy and cheap. Since you're not relying on heavy server or database processing you won't run in to the same limitations as you can normally run into. You're only serving static assets and lets the client handle most of the lifting. With a powerful CDN you'll be needing much fewer resources to scale your website. This means that scaling is not only easier, but will often be cheaper as it won't require you to upgrade servers.
  • Great developer experience. As a developer you get all the flexibility in the world, since you can choose your own tech stack. Developers can do their thing without worrying about limitations of a certain platform or technology.

 

Cons of using JAMstack

  • Not content editor friendly. Developers might love it, but that is not necessarily the case for content editors and marketers. Since you have to serve your content with Markdown, your editors will need to be fairly technical to create and update content. This can often require teaching your editors new skills and will slow down content production as they lose editor features they're used to from a CMS. At the same time they'll be responsible for proper media management, which can be a tedious process.
  • Updates = coding. If you want to make any updates to your templates, you'll need to do it by coding. This will often mean that developers will have to spend more time on making the updates, since they can't be easily changed in other ways. 
  • Limited flexibility for dynamic features. JAMstack sites are great as long as we're building pages with text and images. As soon as your site requires dynamic features you'll run into issues. Without having a database to process your requests, you will need to do more of the heavy lifting. This doesn't mean it's not possible, but it limits your flexibility and it requires more resources to achieve.
  • Live and die by third party systems. Since your entire website is built on third party systems and API's you're relying on them to be consistent. If a third party system goes down or an API goes down, so does your website. This is no different from a normal website where the server goes down, but with a JAMstack site it's very limited what you can do yourself to fix the problem. 

Is JAMstack the future?

Yes and no. For the right project, JAMstack is definitely a good solution and the decoupled architecture bring a lot of advantages to many websites. 

The state of JAMstack right now is still on the technical side though, with both developers and editors needing a certain level of technical skills to be successful. So if your team does not possess the necessary skills to work efficiently with the JAMstack, then you might not see the results you want to.

It won't matter how fast your website is to a visitor if all they see is the same old content, that your editors are struggling to update.

 

If you want to negate the primary con of a JAMstack site - the editor experience - you should take a look at using a headless CMS. By doing so, you'll still be able to rely on a decoupled architecture with RESTful APIs serving the content, without compromising the editor experience.

Can I use Umbraco for JAMstack sites?

Yes, you can use Umbraco to build a JAMstack website.

The Umbraco CMS is not a headless CMS out-of-the-box, but it's built with the flexibility and extendability to make it into a headless CMS if you want to. Everything in the Umbraco backoffice is connected with open APIs, so if you want to use a different front-end to serve your content, you can build it. This would require you to customize Umbraco, but it is definitely a great use of the open source version of Umbraco.

If you don't want to build it yourself, you can go with Umbraco Heartcore.

Umbraco Heartcore is the official headless CMS, hosted and managed by Umbraco HQ. It's based on the open source CMS and the editor experience that you know from the open source CMS, but packaged as a managed and hosted SaaS solution. This gives you a content management system that is focused on giving your content editors a great experience, without having to worry about learning Markdown or having to deal with managing media.

For developers it's ready to use with open RESTful APIs that you can connect to the frontend of your choice. And with Cloudflare CDN included and a managed API, you don't have to worry about maintaining another codebase or API.

If you're interested to learn more about Umbraco Heartcore you can go take a look at the product features here.

Do you want to try it out for yourself? Then you can take a 14-day free trial.

Loved by developers, used by thousands around the world!

One of the biggest benefits of using Umbraco is that we have the friendliest Open Source community on this planet. A community that's incredibly pro-active, extremely talented and helpful.

If you get an idea for something you would like to build in Umbraco, chances are that someone has already built it. And if you have a question, are looking for documentation or need friendly advise, go ahead and ask the Umbraco community on Our.

Number of active installs
502567
Number of active members in the community
221745
Known free Umbraco packages available
1211

Want to be updated on everything Umbraco?

Sign up for the Umbraco newsletter and get the latest news and special offers sent directly to your inbox