the JAMstack

Puppies and Portfolios explores:

what is "JAMstack"?

j

avascript

m

arkdown

a

PIs

what is "JAMstack"?

but actually...

You can still have a JAMstack site and skip and (or all) of the layers: JavaScript, APIs, and Markdown.

what is "JAMstack"?

So what makes a website "JAM"?

Doesn't depend on a web server

Sites can be disqualified if they....

  • are built with a server-side CMS (think Wordpress)
  • are monolithic server-run apps that rely on backend languages like Ruby or Node

what is "JAMstack"?

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.org/

why the  JAMstack rocks

  • Better Performance
  • Cheaper, Easier Scaling
  • Higher Security
  • Better Developer Experience

JAMstack tools

What do you need to get started?

  • Content Management System (CMS) *
  • Static Site Generator *
  • Host with a Content Delivery Network (CDN)

JAMstack tools: CMSs

Headless CMS

Decouples the front end visual build from the content.

API driven

You get two categories to pick from:

Git based

JAMstack tools: CMSs

API driven

Git based

+ Supports multiple apps & sites pulling from a single source of truth data source.

? Fully separates content from the design

- Not version controlled in git

 

+ Full version control

+ Content lives as text files in the project. No context switching for developers

+ Easy to roll back

? Everything in one place

- Doesn't work as a source of truth for multiple applications / sites

- Can be overwhelming if too much content

JAMstack tools: CMSs

API driven

Git based

TinaCMS

JAMstack tools: CMSs

go to: headlessCMS.org for more info and to find available options

JAMstack tools: SSGs

Static Site Generators

Generates all the pages of a website at build time when there's actually changes to the site.

Your choice here is basically what language do you want to work with

JAMstack tools: SSGs

Static Site Generators

JAMstack tools: SSGs

go to: staticgen.com for more info and to find available options

JAMstack tools: Host

When picking a host consider the following :

  • Ease of use
  • Available features
  • Automatic Deploys
  • Cost

For me, this means nothing beats Netlify!

JAMstack tools: Host

With Netlify

  • Ease of use - Super fast setup (< 2 minutes!)
  • Available features - So many! Forms, Serverless functions, Built in CDN, Atomic Deployment, Custom DNS, Analytics, A/B testing, Identity... & MORE
  • Automatic Deploys - Built in!
  • Cost - Very expansive free tier!