Why I Embraced the JAMstack to Build Web Sites

I think the hardest thing to do in life is move on to something new, something that exists outside of the normal comfort zone.

For me, that comfort zone has been WordPress. While I have been working as a Drupal developer for about a year and a half, WordPress has been my bread and butter since 2016.

I don't particularly like building and managing WordPress websites, however. PHP ranks pretty low on my list of favorite programming languages (it's slightly above Visual Basic). I don't like setting up and administering WordPress installations. And, most of all, I don't like paying for web hosting, be it shared, managed, VPS, or whatever.

These dislikes added up to a sense of stagnation. I wasn't coding like I knew I always should be. And I began to feel like my web development skills were falling behind. Modern web development trends were drifting away from the WordPress-way of doing things.

Enter the JAMstack

JAMstack stands for JavaScript, APIs, and Markup. The JavaScript part is self-explanatory. APIs for server side operations should be abstracted and reusable. Think about a REST endpoint to retrieve blog posts. Markup represents the static HTML content that is created from Markdown, JSON, or other data sources.

What does this matter?

WordPress is a monolithic application consisting of MySQL, Apache or Nginx, and PHP. Traditionally, this all runs on one web server. To increase site performance, WordPress sites have some type of caching set up and are probably behind a content delivery network. When a visitor makes a request, the CDN is hit, then the server cache, and then the database in that order.

The JAMstack simplifies the "stack" by going serverless. A JAMstack site will retrieve the content from whatever source (Markdown, WordPress REST API, etc.) at build time to generate static HTML. This static HTML can then be deployed directly to a CDN-backed service like Netlify. Thus, JAMstack approach has eliminated the web server entirely.

What are the benefits:

  1. Lower costs
  2. Better build tools
  3. Built in need for code revisioning
  4. Website can be built more like an app

My Stack

There are an almost limitless number frameworks to use to build a JAMstack site. To pick the one that works for your project, answer the following questions:

Do you prefer a particular frontend framework like Angular, React, Vue, or Svelte?

Each frontend framework has at least one widely used project for building JAMstack sites. There are also many static site generators that work indepent of any one framework.

I chose NextJS because I wanted to learn React.

How do you want to manage your content?

For my personal blog, I am comfortable editing Markdown files. For my tech-curious clients that don't mind learning something new, I would use NetlifyCMS to manage content in a git repository. For the less tech-savvy clients, I would use WordPress. And for a large organization that has multiple teams and custom authentication, I would use Drupal.

I chose to use Markdown for my blog content and JSON for specific pages like my resume. I manage this using NetlifyCMS.

Summary

The JAMstack approach to building websites is quickly becoming the default in the industry. I like it because my site is faster, my code is cleaner, and my hosting bill is cheaper. Sounds like a win, win, win to me.

For more information, check out JAMstack.org, JAMstack.wtf, and NextJS.