Stack OverflowMediumdev.toGitHub

Use Ghost as a completely decoupled headless CMS and bring your own front-end written in Eleventy.

Build an API driven static-site

There has been a lot of progress around static site generators, front end frameworks and API-centric infrastructure in recent years, which has generated some very cool products, like Eleventy. Since Ghost allows you to completely replace its default Handlebars theme layer in favour of a front-end framework, you can use Gatsby to build your site statically from the Ghost API.

The headless-cms revolution

Using a static site generator usually involves storing Markdown files locally in the code repository. This would involve using a code editor to write content and a GIT workflow to publish - which works fine for small sites or developers. However, it's not ideal for professional publishers that need to scale. This is where a headless CMS comes in!

Instead, you can use Ghost for authoring, and then build out your front-end in Eleventy to pull content from the Ghost API. This provides several benefits for publishers:

  • Developers can use their preferred stack
  • Writers have their preferred editor & content management
  • Performance is the maximum possible
  • Security is the maximum possible
  • Your site will be extremely scalable

Building sites in this way has become known as the JAMstack - (as in JavaScript, APIs, Markup). When you look at the bigger picture of the content mesh, it really starts to feel like an inevitable future for building websites.

Official Netlify Support

Deploying a static site with Eleventy and Ghost should be easy - so we've partnered with Netlify, which we also use for Ghost Docs:

Netlify integration for Ghost

The official integration guide for Netlify  explains how to set up outgoing webhooks in Ghost to trigger a site rebuild on Netlify. This means that any time you publish, update or remove any content in Ghost, the front end will update.

Future-proof publishing

Converging disparate technologies under a single front-end centralises otherwise decentralised services in a way which caters predominantly to the needs of the site owner, rather than the platform and fosters flexibility and scalability.

No more platform-specific plugins and extensions. Just one front-end, and many APIs; all connected together and served as a single site bundle with Eleventy!