In my previous article, I talked about how to install Ubuntu as Windows subsystem and how great it is for developers. If you do not know what WSL is and want to learn how to install it on Windows check out the article:
In this article, we will use the WSL Ubuntu to install the Ghost content management system (CMS) in a local development environment on your Windows machine. This is ideal, if you want to setup a new Ghost blog and develop your own Ghost theme.
Before we install Ghost, we need to install some applications as prerequisites for Ghost. We start with setting up node.js, nvm and npm in your WSL Ubuntu environment.
Install node.js, nvm and npm
What is even the difference between all these?
- node.js is a runtime environment for JavaScript to execute scripts written in JavaScript outside a browser.
- nvm ist the node version manager. So to say, it is a meta-tool to manage several installations of node.js on the same system. It is mainly used to handle different versions required by JavaScript applications as some applications may need a specific version of node.js to run on.
- npm is the node package manager. It behaves like Aptitude for Ubuntu. You can easily add and install libraries from a centralized repository (or any centralized repositories if you wish).
Ghost is written in JavaScript and needs node.js to run on. We will use nvm to pick a specific node.js version that Ghost specifically needs. And finally, we use npm to pick the Ghost version we want to install.
So let us start with installing node.js, nvm and npm on the Ubuntu system. First, we install nvm as it lets us easily add any node.js version. Open the Windows Terminal with a Ubuntu profile and run:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/master/install.sh | bash
After execution, check if nvm is installed and working using the command nvm --version
:
daniel@DESKTOP:~$ nvm --version
0.39.1
The command nvm ls
lists all currently installed versions. We install the current version and the long-term support (LTS) version 16.13.0 that is specifically required by Ghost:
# install latest
nvm install node
# install LTS 16.13.0 for Ghost
nvm install 16.13.0
If you now run node --version
to check the installed node version it will print the version number of the latest node you installed, something like:
daniel@DESKTOP:~$ node --version
v18.9.0
To install Ghost locally, we need to switch to the LTS version 16.13.0. That is why we have nvm, to easily switch to another version. Note that you have to switch the version every time you open a new Terminal session. To install the latest Ghost command-line interface (CLI) run:
nvm use 16.13.0
npm install ghost-cli@latest -g
Next, we create a directory for Ghost in our user home directory and install a Ghost instance therein:
cd ~
mkdir ghost
cd ghost
ghost install local
That's it. Once the command finishes, you can access Ghost via your browser on http://localhost:2368
and http://localhost:2368/ghost
for Ghost admin. The following Ghost commands may be useful:
ghost start
to start Ghostghost stop
to stop Ghostghost log
to view logsghost ls
to list all running Ghost blogs
nvm use 16.13.0
again once to use the right node version. Otherwise, the Ghost commands will throw errors.nvm use 16.13.0
and ghost start
by adding the file ~/.bash_aliases
(if it does not exist yet on your Linux environment). Add the content alias ghoststart='nvm use 16.13.0 && ghost start'
. Once you reopen the Terminal or use source ~/.bashrc
you can use the command ghoststart
to run both commands at once.As we now have our Ghost instance and want to process with theme development, we install yarn and gulp.js for the theme build chain.
Install yarn and gulp.js
We were finished, right? Well, if you want to start developing themes based on the standard Ghost theme Casper, then you will need yarn and gulp.js. Yarn is yet another package manager for node.js (similar to npm). Gulp.js is a software written in JavaScript running on node.js that automates build processes.
To install yarn run:
curl -o- -L https://yarnpkg.com/install.sh | bash
To install gulp.js run:
npm install --global gulp-cli
Now you are able to rebuild the Casper theme locally. You want to do that after you changed any files. To build the Casper theme navigate to the directory and run yarn:
# change directory
cd ~/ghost/content/themes/casper/
# install dependencies
yarn install
# run development server
yarn dev
The latter blocks the shell until you explicitly terminate that application with CRTL + C
, automatically detects changes in any files of the theme and rebuilds the theme. Yarn is internally calling gulp scripts managed in the gulp build file gulpfile.js
to (re-)build the theme.