Putting the 'A' in JAMStack With Headless CMS

The way we build web apps continues to change – with an increasing number of web apps using a static frontend, powered by a dynamic backend. The moniker for this movement is JAMStack – for Javascript, APIs, and Markup.

In this Tech Talk, Chris on Code, the founder of Scotch.io, discusses JAMStack best practices, and some of the ways that you can set up your API layer by running a headless CMS on DigitalOcean Droplets. Chris zooms into three of the most popular free, open source CMS platforms – Wordpress, Ghost, and Strapi – and how to use them for your backend APIs.

In the Jamstack, the A symbolizes where we get our data from. Our data comes from APIs and this is very beneficial to us because we are allowed to separate our data from our frontend.

Separating our frontend from our data allows us to focus on one at a time. We can use a Headless CMS that comes packaged with database connections, an admin dashboard, and more so that we can create an API quickly.

Here’s a list of good headless CMSs: headlesscms.org

There are hosted headless CMS solutions like:

• Contentful
• Prismic
• Sanity
• DatoCMS
• CosmicJS

There are also solutions that we can host on DigitalOcean on our own servers so that we control all of the data and keep our pricing under control.

• WordPress
• Ghost
• Strapi
• Statamic

DigitalOcean makes it easy to self-host these Headless CMSs with a single click. You can find the 1-click apps on the DigitalOcean Marketplace:

• WordPress
• Ghost
• Strapi

Once we have our Headless CMS in place, we can work on our frontends using a frontend technology like React, Gatsby, Next.js, Vue, Nuxt.js, Hugo, and many more.

Chris Sev is the founder of Scotch.io, a popular JavaScript tutorial site. He is also a Senior Developer Advocate at DigitalOcean. Chris has a strong focus on JAMstack since it is the fastest and most productive way we can create our sites and applications.