NetlifyCMS & 11ty a Story Told in Three Acts

Back to blog

3 min to read

NetlifyCMS & 11ty a Story Told in Three Acts

Our CTO Thom Krupa had a live-coding session with 11ty and Netlify CMS at 2nd JAMstack Wrocław Meetup.

Thom Krupa

By Thom Krupa
April 24, 2019

Holding a talk at the #2 JAMstack meetup in Wrocław, was really challenging. We had a knowledgeable public so no general-cutting-corners-gibberish talk would work there. Plus I’d had to match whatever Martin Walker from Contentful had in mind.

With Contentful being one of the best known API-first headless CMSs that topic was out of bounds so to speak. So, I decided to introduce the crowd to Git-based CMSs, compare them with the API driven approach and spice it up with a couple of examples.

Now for the sake of this post, I'll give you a quick rundown of the topic I’ve covered. In case you want more I invite you to take a quick look at the deck I used and listen to the talk shared below.

Sign up for our JAMstack newsletter!

Get our EXCLUSIVE web development case studies in your mailbox!

Headless CMSs

Unlike the CMSs of so-called legacy systems like Wordpress or Joomla, headless CMS (also known as "Decoupled CMS") is not attached to the frontend. Because the CMS is separated from the actual website it is not responsible for serving the website or an app nor does it care where you use the content.

API driven CMS

There is a couple of ways Headless CMS can work. API driven CMS is a cloud hosted CMS. It gives developer rest-like or graphql-like API to fetch content. Good examples are Sanity, Prismic, Storyblok or Contentful.

Git-based CMS

The 2nd type is git-based CMSs and in the talk I held I wanted to focus on this category. Git-based CMS is basically a layer on top of Git, it's interacting directly with the git repo. Every action that happens in the CMS like editing, creating and deleting is an action taken as part of the git workflow.

NetlifyCMS is probably the most popular open source and community-driven CMS and it works with every static site generator. Of course, there is Forestry which is definitely the most popular closed source git-based CMS which currently supports Hugo, Jekyll and VuePress.

Of course, there is more to git-based CMSs but you’ll have to turn to the audio of the talk below for that.

Examples

Two actually. Recently, at Bejamas we've developed a simple website for a small Swiss-based company. Under the hood we use Gatsby as a Static Site Generator, NetlifyCMS to manage the content and PayPal for payment processing.

The whole setup works really great. It's fully static and crazy fast while the client is able to edit the content, receive orders and payments. Best of all, the hosting costs exactly 0 bucks per month and it is crazy fast.

The second one was for Oslo City Bike a service that allows you to rent a bike via the website or mobile app. Under the hood, Oslo City Bike uses Sanity as the API. Why mentioning it here?

Listen to the talk.

Last Piece Of The Puzzle: 11ty

11ty was created by Zach Leatherman to be a JavaScript alternative to Jekyll. It uses Node.js to transform templates into html files and it takes an advantage of huge JavaScript ecosystem. You can develop a custom plugin, publish it to npm and other developers will be able to use it in their projects.

To dive deeper on how and why we used it please check out the talk below.

snip

deck capture

Share

About author

Thom Krupa

Thom Krupa

CTO and co-founder at Bejamas with over 6 years of experience in the web development space and 4 years of experience as WordPress developer. Now strongly focused on the JAMstack and serverless architecture.

Readers also enjoyed