How To Install Gatsby on Ubuntu 20.04 LTS

In this tutorial, we will show you how to install Gatsby on Ubuntu 20.04 LTS. For those of you who didn’t know, Gatsby is a React-based GraphQL powered static site generator. During build time Gatsby fetches all the data, renders the entire website into static HTML, CSS, JS files with the data available at that time. As it generates the static files, Gatsby applications can be deployed anywhere.

This article assumes you have at least basic knowledge of Linux, know how to use the shell, and most importantly, you host your site on your own VPS. The installation is quite simple and assumes you are running in the root account, if not you may need to add ‘sudo‘ to the commands to get root privileges. I will show you the step-by-step installation of the Gatsby on Ubuntu 20.04 (Focal Fossa). You can follow the same instructions for Ubuntu 18.04, 16.04, and any other Debian-based distribution like Linux Mint.

Prerequisites

• A server running one of the following operating systems: Ubuntu 20.04, 18.04, and any other Debian-based distribution like Linux Mint or elementary OS.
• It’s recommended that you use a fresh OS install to prevent any potential issues.
• A non-root sudo user or access to the root user. We recommend acting as a non-root sudo user, however, as you can harm your system if you’re not careful when acting as the root.

Install Gatsby on Ubuntu 20.04 LTS Focal Fossa

Step 1. First, make sure that all your system packages are up-to-date by running the following apt commands in the terminal.

sudo apt update
sudo apt upgrade
sudo apt install build-essential

Step 2. Installing Node.js.

Now add Node.js repository to your system:

curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
sudo apt install nodejs

Now check your Node.js version to make sure it works with:

nodejs -v

And check the NPM version too:

npm -v

Step 3. Installing Gatsby on Ubuntu 20.04.

The Gatsby CLI is available via npm. Run the following command to install gatsby-cli:

npm install -g gatsby-cli

Check Gatsby installed properly with:

gatsby -v

Step 4. Building Your Gatsby Site.

Now create your first Gatsby test site:

gatsby new hello-world https://github.com/gatsbyjs/gatsby-starter-hello-world

This command created a directory called hello-world and downloaded the test site to it, you can now run the starter site with:

cd hello-world
gatsby develop

Step 5. Accessing Gatsby Site.

Once completely successfully installed, your Gatsby site is now running at http://localhost:8000 and should output Hello world!

Congratulations! You have successfully installed Gatsby. Thanks for using this tutorial for installing the Gatsby on Ubuntu 20.04 LTS Focal Fossa system. For additional help or useful information, we recommend you check the official Gatsby website.