Like many other people, I started in web development when the frontend was just about HTML + CSS + Javascript (jQuery, to be honest) and the backend ran with a LAMP stack, (Linux operating system, with the Apache web server, the site data stored in a MySQL database, and dynamic content processed by PHP).
Not so long ago, we lived through the golden years of the MEAN stack, when for the first time Javascript brought the worlds together and allowed us to handle frontend and backend with the same language. MEAN includes MongoDB, Express.js, Angular, and Node.js (there are also variants like MERN using React.js or MEVN using Vue.js).
Nowadays, we are starting to wrap our minds around a new idea, the Jamstack architecture. And perhaps, as I did, you are wondering: Why? When is this going to end? Why do you hate us, Lord of the Web? But, do not worry! Apparently, one of the benefits of Jamstack is that it will make our lives easier, so let's take a look at it and try to answer some questions.
What is Jamstack?
JAM stands for JavaScript, API & Markup.
JavaScript: Dynamic functionalities are handled by JavaScript. There is no restriction on which framework or library you must use.
APIs: Server-side operations are abstracted into reusable APIs and accessed over HTTPS with JavaScript. These can be third party services or your custom function.
Markup: Websites are served as static HTML files. These can be generated from source files, such as Markdown, using a Static Site Generator.
According to jamstack.org, this architecture is “designed to make the web faster, more secure, and easier to scale. It builds on many of the tools and workflows which developers love, and which bring maximum productivity.”
The core principles of Jamstack
Jamstack is based on two main principles:
Pre-rendering: To generate the markup which represents a view in advance of when it is required. This happens during a build rather than on-demand so that web servers do not need to perform this activity for each request received.
Decoupling: The process of creating a clean separation between systems or services. By decoupling the services needed to operate a site, each component part may become easier to reason about, can be independently swapped out or upgraded, and can designate the purview of dedicated specialists, either within an organization, or as a third party member.
This means the entire front end is prebuilt into highly optimized static pages and assets during a build process. Therefore, these static sites can be served directly from a CDN, reducing the cost, complexity, and risk. Fortunately, there are many familiar tools that allow us to build these sites, like Gatsby, NextJS, NuxtJS, Hugo, Jekyll, Eleventy, to name a few.
Once we have the markup and other user interface assets very quickly and securely served directly from a CDN, the sites can use JavaScript and APIs to talk to backend services, allowing experiences to be enhanced and personalized.
This also allows us to outsource some services like authentication and identity, payments, content management, data services, search, and much more. Jamstack sites might utilise such services at build time, and also at run time directly from the browser via JavaScript. The clean decoupling of these services leads to greater portability and flexibility, as well as significantly reduced risk.
The Benefits of Jamstack
A Jamstack architecture benefits sites and projects workflows in different ways, among which we can highlight
Security: By removing multiple parts and systems from the hosting infrastructure, there are fewer servers and systems to harden against attack. Read-only hosting of pre-generated pages and assets reduces attack vectors even further. Meanwhile dynamic tools and services can be provided by vendors with teams dedicated to securing their specific systems and providing high levels of service.
Scale: Popular architectures deal with heavy traffic loads by adding logic to cache popular views and resources. Since the Jamstack sites are served entirely from a CDN, there is no complex logic or workflow to determine what assets can be cached and when everything can be cached in a content delivery network, characterized by simple deployments, built-in redundancy, and incredible load capacity.
Performance: Jamstack sites remove the need to generate page views on a server at request time by generating pages ahead of time during a build. Very high performance is possible without introducing expensive or complex infrastructure.
Maintainability: Hosting complexity is reduced, so are maintenance tasks. A pre-generated site, being served directly from a simple host or directly from a CDN, is almost maintenance free.
Portability: Jamstack sites are pre-generated. That means that you can host them from a wide variety of hosting services and have greater ability to move them to your preferred host. Any simple static hosting solution should be able to serve a Jamstack site.
Developer Experience: Jamstack sites can be built with a wide variety of tools. As we mentioned earlier, they do not depend on the proprietary technologies or specific frameworks. Instead, they build on widely available tools and conventions.
To sum up!
The benefits of Jamstack are certainly attractive and the tools to use are not completely unknown. This may be a very good time to continue digging into this new architecture and try to get the best of it, at least before something new comes up!
👏 🎉 We really appreciate this time together. See you around.
Please, Remember to Keep Safe!
if you're looking for a new development team to handle your digital transformation, we'd love it if you consider our team. send us an email to info@darwoft.com to see if we might be a good fit.
Let's Build What's Next. Together.