Please note that a lot of the Starters are out of date and given constraints in bandwidth and other priorities, we've decided to sunset all Starters and only actively maintain a single Next.js Starter. At the moment the contents of this article will not work as we work on updating the new Next.js Starter. We appreciate your patience and can't wait for you to try the new starter.
There are several ways to start a project with Strapi. You can create a blank project from scratch or use one of our starters to spin up a corporate website, a portfolio, an e-commerce solution, a blog, or a catalog using the frontend technology of your choice (Next.js, Gatsby, Gridsome, Nuxt.js).
Creating full stack Strapi applications with starters just got easier 🙌 Now, with one command, you can have a monorepo running your starter frontend and Strapi backend in minutes.
How to use the starter CLI
There are two ways to use the CLI.
The GitHub URL of the Strapi starter :
# yarn
yarn create strapi-starter my-project https://github.com/strapi/strapi-starter-gatsby-blog
# npx
npx create-strapi-starter my-project https://github.com/strapi/strapi-starter-gatsby-blog
or a shortcut to the Github repository:
# yarn
yarn create strapi-starter my-project gatsby-blog
# npx
npx create-strapi-starter my-project gatsby-blog
Pro tip: You can create a project from a specific branch with a url like this:
https://github.com/strapi/strapi-starter-gatsby-blog/tree/<my-branch>
The CLI will create a monorepo, install dependencies, and run the project automatically. In the end, you will have a file structure that looks similar to this:
/my-project
/frontend // strapi-starter
/backend // strapi-template
We've created several starters ready for you to use right now. Check them out on our starters page.
We are always expanding our starter catalog, so let us know what we should build next in the comments below.
How it works
Essentially the CLI connects a strapi-starter with a strapi-template. For this to work, every starter repository must contain a starter.json file and a starter directory.
The starter.json references the template (Strapi backend) to be used, and the starter directory contains all the files and folders for the chosen frontend (i.e. Gatsby).
/starter // Frontend files and folders are in here
starter.json // {"template": "github.com/some-strapi-template"}
For example, when you run the command yarn create strapi-starter my-project gatsby-blog , the CLI will fetch the strapi-starter-gatsby-blog, copy the contents of the starterdirectory into my-project/frontend and start installing dependencies.
Then it will read the starter.json file, fetch the strapi-template-blog and build a new Strapi application at my-project/backend.
Finally, the CLI will run both backend and frontend applications simultaneously and you will be able to access them in the browser.
Here's a video tutorial to help you get started with the CLI:
How to use your own starter
Maybe you've already developed your own starters and templates, you want to remix one of ours, or you want to create a new one!
You can still use the CLI to bootstrap your own starter projects. Just be sure to follow the file structure mentioned above.
One thing to keep in mind here is that if you want to use the shortcut, you will need to name your starter strapi-starter-<frontend-type>-<template-type> and specify your username in the command:
# yarn
yarn create strapi-starter my-project markkaylor/gatsby-catalog
# npx
npx create-strapi-starter my-project markkaylor/gatsby-catalog
Now go build something, and be sure to share what you make with us on Twitter!
