Gotede - quickly create a ghost theme development environment

When setting up a new theme for this blog, I ran into the issue of quickly setting up a development environment on my local machine to test out ideas.

So I went on to duckduckgo.com and quickly found this blog article.
Taking it as an inspiration I wrote a small script to publish on npm to make it easier for future themes and other people as well. You can find it at https://github.com/b-m-f/gotede.

This blog post will summarize how to get started with it.

Installing gotede

The first thing you will need to do is to install the script with npm install -g gotede.

You also have to make sure to install both docker and docker-compose.

Now all you need to do is to switch to a folder in which the theme folder should be created. For example your home directory with cd ~.

Running gotede will ask you for the name of your new theme and which port the Ghost developemt instance should run under on your localhost (4000 f.e.).

Once youve entered your answers a new folder will be in that directory, with the name of the theme you entered. Go into that folder with cd THEME_NAME_YOU_ENTERED and start up the instance with docker-compose up -d.

For this example I am going to continue with a supplied port number of 4000.

To make sure that everthing worked correctly open your browser and go to http://localhost:PORT_YOU_PROVIDED, so in my case http://localhost:4000.

You should be greeted with the familiar skeleton instance of ghost, looking like this:

Screenshot_2018-09-11-Ghost

Setting up the Ghost instance

If everything worked, you should head over to http://localhost:4000/ghost to set up your admin account. Just follow the steps shown on the website. You can just use a test account here, since it will only be running locally.

Creating the theme and activating it

For this step make sure that you are still in the folder that gotede created for you and where all your files for the theme are located in.
This will be where you do the actual work.

To get everything running you will first need to install all the required npm dependencies. Do this with npm install.

Once it is completed we can start the local development server that will take care of compiling our css and supplying the ghost instance with our theme with npm run start.

Since the theme is newly added to the instance, we will have to restart it with either docker restart THEME_NAME_YOU_PROVIDED or docker-compose restart so that it becomes available.

As a last step head over to http://localhost:4000/ghost/#/settings/design and activate your theme at the bottom of the page:

Screenshot_2018-09-11-Settings—Design—test

Developing the theme

With the npm run start running in the terminal you can now start editing your theme according to the official docs.

Have fun, and feel free to improve the script and the skeleton theme from gotede by submitting a Pull Request to the Repo.

Back to overview