What’s a Jamstack?
According to Jamstack.org, it’s a unique approach to building websites and software for the web:
Fast and secure sites and apps delivered by pre-rendering files and serving them directly from a CDN, removing the requirement to manage or run web servers.
Jamstack sites deliver better performance, higher security, lower cost of scaling, and a superior developer experience.
How does the Jamstack compare with another type of system, such as a monolithic CMS (Content Management System) like WordPress or a bespoke application built in a framework like Ruby on Rails?
Single App Stack: Built Upon Each Request. WordPress, Ruby on Rails, Node, Squarespace, etc. are all designed to run as server software that delivers website content to site visitors at the moment they request it. In other words, when a web browser goes to a specific page, the server software has to generate that page on the spot and send it to the browser.
Jamstack: Pre-Built When Content Updates. A Jamstack website is instead served from a CDN (Content Delivery Network) or standard filesystem rather than a dynamic application server. That means when a visitor opens up a Jamstack site, the essential design and content is not being generated on-the-fly, but rather is coming from a recent, pre-built static snapshot. The speed at which that data transfer can happen and the simplicity of scaling that solution to thousands or even millions of users is an order of magnitude simpler (and cheaper) than the dynamic server approach.
Because Bridgetown is a Jamstack framework/site generator, this is how you’d go about developing a website. The process is essentially reversed from the catchy acronym JAM: you start with the markup and work your way up to dynamic frontend functionality.
Markup. You start by defining the HTML templates of your website and writing CSS to lay elements out on the page, set typography, and add other graphical enhancements. You author content (blog posts, informational pages, structured data collections, etc.) in simple formats like Markdown, YAML, CSV, JSON, etc., and that content gets automatically converted to final HTML whenever Bridgetown is instructed to build the site for deployment.
How Do You Edit and Publish Content with the Jamstack?
There are typically three different ways to author, manage, save, and publish website content when working with Jamstack sites. Some are easier for programmers, others are easier for visually-focused content creators and editors.
Save Files in the Git Repository. Because Jamstack sites are typically located in a version-controlled code repository using Git, and saved onto a central repo service such as GitHub, you can clone the site files directly to your device, add Markdown posts and other site content, and commit those changes to the repository. Once you push those changes back up to GitHub (for example), that usually triggers an automated build process to publish the latest changes to the web. Jamstack-focused services such as Render are a great way to build and publish the website. Unlike hosting services of the past, Render’s starting price can’t be beat: it’s free 😁.
Use a CMS-like editing interface. There is a growing number of tools which provide a familiar visual editing interface on the web, but under the hood modify the same files in the repo (Markdown posts, data collections, etc.) much like the first process above. Examples of these kinds of tools are Forestry, Siteleaf, Netlify CMS, and many others.
Store content inside a “headless” CMS. This utilizes a process closest to the previous era of dynamic CMS applications. With what’s called a “headless” CMS, you author content interactively using the CMS, and content is stored in that CMS’ database. When content is ready to get published, a build process is triggered for the Jamstack site generator (aka Bridgetown), but at that point the generator uses the headless CMS’ API to download all relevant data and produce the final website for deployment. There are many headless CMS tools available, and you can even use WordPress itself as one! (Although that’s not typically recommended… 😋)
How Do I Get Started Building a Jamstack Website?
We’re biased, of course, but our recommendation is simple: install Bridgetown, run
bridgetown new to create a blank site repository, and start customizing your HTML templates, adding a fun CSS framework like Bulma or Tailwind, and authoring some content. Once you have something you like, simply push the repository up to GitHub, connect the repo up to a Jamstack hosting service like Render, and deploy. That might sound like a daunting sequence of steps, but once you get the hang of it the whole process might only take up a breezy afternoon. (Some of us remember spending hours just wrestling with MySQL databases and WordPress theme files! The future is bright, folks! 😃🎉)