How to create a Gatsby project with our quickstart repository

The Gatsby Divio quickstart repository is a template that gives you the fastest possible way of launching a new Gatsby project on Divio.

It uses a completely standard Gatsby project as used in the Gatsby Hello World boilerplate.

The repository contains some additional files to take care of the Docker set-up.

Clone the repository

Run:

git clone git@github.com:divio/gatsby-divio-quickstart.git

Run the project locally

This section assumes that you have Docker and the Divio CLI installed. You also need an account on Divio, and your account needs your SSH public key. See How to set up the Divio local development environment if required.

Build the Docker image

Run:

docker-compose build

Launch the local server

docker-compose up

This starts up the container with the default command in the docker-compose.yml file, which is:

gatsby develop --port 80 --host 0.0.0.0

Try accessing the site at http://127.0.0.1:8000/.

If you comment out that line in docker-compose.yml, it will start up with the command specified in the Dockerfile instead.

You now have a working, running project ready for further development. All the commands you might normally execute in development need to be run inside the Docker container - prefix them with docker-compose run web.

Customisation and further development

You have multiple options for customisation. For example, this application is not configured to use a database, but if you need to Gatsby makes several database options possible. Other customisation could include installing additional system-level packages, Gatsby plugins and so on.

You’ll need to change a few lines of configuration to achieve this across a few files. See the notes for each of:

Building on the host as an option

If you uncomment the:

# - ".:/app:rw"

entry in the web:volumes section of docker-compose.yml, the entire /app directory will be overridden by the project files from the host. This can be useful for development. However, you will now need to run the commands npm install and gatsby build on the host as well in order to regenerate the files so that the container sees them.

Deployment

Your application is ready for deployment on our cloud platform. The basic steps are:

  • create a project on the Divio Control Panel, with any required services

  • push your code/connect your Git repository

  • deploy one or more cloud environments

These steps are covered in more detail in Deploy your application to Divio.