GRANDstack – GraphQL, React, Apollo, Neo4j Database
LAMP – Linux, Apache, MySQL, PHP
MEAN – MongoDB, Express.js, Angular, Node.js
The list above is just a few examples of some popular tech stacks. Tech stacks are practical combinations of technologies and architectural patterns used to create robust solutions. A relatively newer stack (new when you compare it to stacks like LAMP, which was first coined in 1998!) is the Jamstack. Let’s get jammin’ with the Jamstack and find out what it is, what it can do, and why you might want to use it for your next web project.
What is the Jamstack
APIs: Server-side processing, services, and database commands are all requested and received via client-side API calls. The APIs can be 3rd party or custom-made.
Markup: Markup is simply HTML files. The HTML can be manually crafted or generated as a byproduct from another source such as Markdown. Markdown is an extremely popular text formatting syntax that can be compiled into HTML. This compiled HTML ultimately becomes what end users see on the final website or app. Many build tools are available to compile Markdown into HTML, including Webpack, Gulp, and old reliable Grunt. For a more comprehensive and complete solution, there are frameworks that can compile an entire website or app. More on frameworks later.
While many tech stacks already focus on web technologies, Jamstack brings a solid set of benefits that make it an appealing option for web projects.
Familiarity – The Jamstack is based upon tried and true technologies. Because Jamstack is technology agnostic, it allows for various approaches to generate the final assets. Very simple or robust methods can be taken to create the final Jamstack solution.
Scalability – As mentioned earlier, a Jamstack website or app enjoys great speed benefits when coupled with a CDN service. CDN services allow Jamstack websites and apps to scale to handle heavy loads easily.
Security – Because Jamstack websites and apps have an architecture with no direct access to databases or other services, an attack vector is removed. Developers are still responsible for applying trending practices to ensure that APIs are secure and sensitive systems are protected.
Community – The community around Jamstack continues to grow each year. As a result, there are many resources, tools, and, most importantly, people involved in the Jamstack ecosystem.
The benefits of utilizing a Jamstack solution have resulted in significant real world improvements. For instance, Smashing Magazine has seen a 10X improvement in their website’s performance, thanks to switching to the Jamstack.
Frameworks to the Rescue
Jamstack websites and apps can be created manually or via a framework. Below are a few prevalent frameworks:
Nuxt.js: Nuxt.js is built with Vue.js development. It’s simple and powerful.
Gatsby: Gatsby is a React-based framework that has an extensive and feature-rich plugin system.
Hugo: Claiming to be, “The world’s fastest framework for building websites,” Hugo is a Go-based framework that excels at rapidly creating websites and apps.
Jekyll: Jekyll is the framework that powers GitHub Pages and is used to generate websites and blogs.
These frameworks can generate assets that make up the output of a Jamstack website or app. These frameworks are commonly categorized as static site generators. A comprehensive list of Static Site Generators can be found at the appropriately named site, Static Site Generators.
Each hosting option provides a wealth of features, in addition to providing a platform for hosting the Jamstack website or app. For a list of some additional hosting options, check here.
The Jamstack is an approach to web development that aims to shift web application architecture from server and client to only the client. The Jamstack brings a slew of benefits that both developers and end-users will surely appreciate. However, like anything, Jamstack is not a silver bullet, and there are use cases where it is not the ideal option. As always, your mileage may vary.
Find below some additional resources to continue learning about Jamstack: