Bootstrap a simple static blog application using Gatsby and Strapi, the most suitable headless CMS for Gatsby.
February 6, 2020
If you are familiar with our blog you must have seen that we've released a series of tutorials on how to make blogs using Strapi with a lot of frontend frameworks: Gatsby old, Gatsby new, React, Next.js, Nuxt, or Angular.
We thought that it would be a good idea to provide the result of these tutorials as starters for those who'd like to bootstrap a simple blog application with Strapi and their favorite frontend framework.
We already released the React Starter, and we keep moving with the Gatsby Starter
Starters allow you to quickly visualize the result of the association between Strapi and your frontend framework.
It's easier and faster to dig into an existing application to get an idea of the product than to start an application from scratch.
As we've made tutorials on how to make a blog with this or that framework, it seemed useful for the Strapi community to use the resulting application in order to create starters.
So to get started with the starter, you have two options:
You can start by installing the starter and then following the tutorial to reproduce it and learn on the way.
Or you can run the starter to directly test the application.
So, let's see how to run it!
Clone the repository and install dependencies
git clone https://github.com/strapi/strapi-starter-gatsby-blog.git cd strapi-starter-gatsby-blog # Using yarn yarn setup:yarn # Using npm npm run setup:npm
This command will launch both of your backend and frontend server and do a data migration in your backend server
# Using yarn yarn build:yarn yarn develop:yarn # Using npm npm run build:npm npm run develop:npm
Alternatively, you can still start your servers separately:
cd backend # Using yarn yarn build yarn develop # Using npm npm run build npm run develop
cd frontend # Using yarn yarn develop # Using npm npm run develop
truefor article and category
You may want to deploy this starter frontend on Gatsby Cloud in order to try the Gatsby Preview maybe!
You'll be asked to select the repository you want to use
frontendin this starter
API_URLfor both of your
Builds Environment variablesand
Preview Environment variables(we consider that you deployed your strapi server)
Now you'll need to create a Webhook on your strapi server in order to tell Gatsby cloud to build your Gatsby project each time your create/update/delete content
That's it! Now Strapi will inform Gatsby Cloud to build your Gatsby project everytime you create/update/delete content
If you liked it, it would be great to share the word 📣 And let me know what you thought of it in the comments below.
Enjoy this starter!