Gatsby - Revision history

Kangtain at 13:31, 2 October 2025

2025-10-02T13:31:40Z

← Older revision		Revision as of 20:31, 2 October 2025
Line 3:		Line 3:
	There are some methods to install both NodeJS and NPM. In this article, we will install them using the node source. For other methods, you can check our blog post on how to install NodeJS and NPM.		There are some methods to install both NodeJS and NPM. In this article, we will install them using the node source. For other methods, you can check our blog post on how to install NodeJS and NPM.

	~~<syntaxhighlight lang="bash">~~		curl -sL https://deb.nodesource.com/setup_14.x \| sudo -E bash -
	curl -sL https://deb.nodesource.com/setup_14.x \| sudo -E bash -
	~~</syntaxhighlight>~~

	Once completed, we need to download the package information from the newly added source above.		Once completed, we need to download the package information from the newly added source above.

	~~<syntaxhighlight lang="bash">~~		sudo apt update
	sudo apt update
	~~</syntaxhighlight>~~

	Next, run the following command to finally install NodeJS and NPM.		Next, run the following command to finally install NodeJS and NPM.

	~~<syntaxhighlight lang="bash">~~		sudo apt install nodejs
	sudo apt install nodejs
	~~</syntaxhighlight>~~

	NodeJS and NPM have been successfully installed, you can check the installed version using this command:		NodeJS and NPM have been successfully installed, you can check the installed version using this command:

	~~<syntaxhighlight lang="bash">~~		node -v; npm -v
	node -v; npm -v
	~~</syntaxhighlight>~~

	==Install Gatsby-CLI==		==Install Gatsby-CLI==
	Gatsby CLI is the main entry point for getting up and running the Gatsby application. It is packaged as an executable that can be used globally. We can install Gatsby CLI via npm.		Gatsby CLI is the main entry point for getting up and running the Gatsby application. It is packaged as an executable that can be used globally. We can install Gatsby CLI via npm.

	~~<syntaxhighlight lang="bash">~~		sudo npm install -g gatsby-cli
	sudo npm install -g gatsby-cli
	~~</syntaxhighlight>~~

	To check the installed version of Gatsby CLI, run this command:		To check the installed version of Gatsby CLI, run this command:

	~~<syntaxhighlight lang="bash">~~		gatsby --version
	gatsby --version
	~~</syntaxhighlight>~~

	Now, let’s create a new Gatsby website, you can replace “gatsby_site” with any name you like.		Now, let’s create a new Gatsby website, you can replace “gatsby_site” with any name you like.

	~~<syntaxhighlight lang="bash">~~		gatsby new gatsby_site
	gatsby new gatsby_site
	~~</syntaxhighlight>~~

	Wait for a few moments, and a new “gatsby_site” directory is created.		Wait for a few moments, and a new “gatsby_site” directory is created.
Line 48:		Line 34:
	Invoke the command below to develop Gatsby and run it.		Invoke the command below to develop Gatsby and run it.

	~~<syntaxhighlight lang="bash">~~		cd gatsby_site
	cd gatsby_site
	~~</syntaxhighlight>~~

	~~<syntaxhighlight lang="bash">~~		gatsby develop -H 0.0.0.0
	gatsby develop -H 0.0.0.0
	~~</syntaxhighlight>~~

	You should be able to access your Gatsby site at ''http://YOUR_SERVER_IP_ADDRESS:8000'', press ''CTRL + C'' if you want to stop it.		You should be able to access your Gatsby site at ''http://YOUR_SERVER_IP_ADDRESS:8000'', press ''CTRL + C'' if you want to stop it.
Line 60:		Line 42:
	Now, let’s build our Gatsby website:		Now, let’s build our Gatsby website:

	~~<syntaxhighlight lang="bash">~~		gatsby build
	gatsby build
	~~</syntaxhighlight>~~

	The gatsby build command is a part of the Gatsby CLI. Run gatsby build command to create a production-ready version of your site when you are ready to publish your site. You can also deploy your Gatsby website to GitHub to set up a CI/CD (Continuous Integration and Continuous Deployment) pipeline.		The gatsby build command is a part of the Gatsby CLI. Run gatsby build command to create a production-ready version of your site when you are ready to publish your site. You can also deploy your Gatsby website to GitHub to set up a CI/CD (Continuous Integration and Continuous Deployment) pipeline.
Line 70:		Line 50:
	Process Manager (PM2) will allow you to keep applications alive forever, reload them without downtime, and facilitate common system admin tasks. Invoke the command below to install PM2 on your Ubuntu 20.04 globally.		Process Manager (PM2) will allow you to keep applications alive forever, reload them without downtime, and facilitate common system admin tasks. Invoke the command below to install PM2 on your Ubuntu 20.04 globally.

	~~<syntaxhighlight lang="bash">~~		sudo npm install pm2 -g
	sudo npm install pm2 -g
	~~</syntaxhighlight>~~

	After installing PM2, we can run these commands to start our Gatsby website on port 8000.		After installing PM2, we can run these commands to start our Gatsby website on port 8000.

	~~<syntaxhighlight lang="bash">~~		cd ~/gatsby-site
	cd ~/gatsby-site
	~~</syntaxhighlight>~~

	~~<syntaxhighlight lang="bash">~~		pm2 start gatsby --name mygatsby -- serve -p 8000
	pm2 start gatsby --name mygatsby -- serve -p 8000
	~~</syntaxhighlight>~~

	==Install and Configure NGINX==		==Install and Configure NGINX==
Line 92:		Line 66:
	First, install Nginx with the following command:		First, install Nginx with the following command:

	~~<syntaxhighlight lang="bash">~~		sudo apt install nginx
	sudo apt install nginx
	~~</syntaxhighlight>~~

	On Ubuntu 20.04, Nginx is configured to start running upon installation, you can check it by running this command:		On Ubuntu 20.04, Nginx is configured to start running upon installation, you can check it by running this command:

	~~<syntaxhighlight lang="bash">~~		sudo systemctl status nginx
	sudo systemctl status nginx
	~~</syntaxhighlight>~~

	Once installed, create a new Nginx server block configuration file. Replace yourdomain.com with your actual domain or subdomain name		Once installed, create a new Nginx server block configuration file. Replace yourdomain.com with your actual domain or subdomain name

	~~<syntaxhighlight lang="bash">~~		sudo nano /etc/nginx/sites-enabled/yourdomain.com.conf
	sudo nano /etc/nginx/sites-enabled/yourdomain.com.conf
	~~</syntaxhighlight>~~

	Add the following content to the file:		Add the following content to the file:

	~~<syntaxhighlight lang="nginx" line="1">~~
	server {		server {

Line 133:		Line 100:
	allow all;		allow all;
	}		}
	}		}
	~~</syntaxhighlight>~~

	Save the file by pressing ''CTRL + O'' then press ''CTRL + X'' to exit the nano editor then restart [[Nginx]].		Save the file by pressing ''CTRL + O'' then press ''CTRL + X'' to exit the nano editor then restart [[Nginx]].

	~~<syntaxhighlight lang="bash">~~		sudo systemctl restart nginx
	sudo systemctl restart nginx
	~~</syntaxhighlight>~~

	==Source==		==Source==

Kangtain at 04:25, 27 January 2023

2023-01-27T04:25:14Z

Show changes

Kangtain: Created page with "==Install NodeJS and NPM== There are some methods to install both NodeJS and NPM. In this article, we will install them using the node source. For other methods, you can check our blog post on how to install NodeJS and NPM. curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash - Once completed, we need to download the package information from the newly added source above. sudo apt update Next, run the following command to finally install NodeJS and NPM. s..."

2022-06-10T15:39:14Z

Created page with "==Install NodeJS and NPM== There are some methods to install both NodeJS and NPM. In this article, we will install them using the node source. For other methods, you can check our blog post on how to install NodeJS and NPM. curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash - Once completed, we need to download the package information from the newly added source above. sudo apt update Next, run the following command to finally install NodeJS and NPM. s..."

New page

==Install NodeJS and NPM==
There are some methods to install both NodeJS and NPM. In this article, we will install them using the node source. For other methods, you can check our blog post on how to install NodeJS and NPM.

curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -

Once completed, we need to download the package information from the newly added source above.

sudo apt update

Next, run the following command to finally install NodeJS and NPM.

sudo apt install nodejs

NodeJS and NPM have been successfully installed, you can check the installed version using this command:

node -v; npm -v

==Install Gatsby-CLI==
Gatsby CLI is the main entry point for getting up and running the Gatsby application. It is packaged as an executable that can be used globally. We can install Gatsby CLI via npm.

sudo npm install -g gatsby-cli

To check the installed version of Gatsby CLI, run this command:

gatsby --version

Now, let’s create a new Gatsby website, you can replace “gatsby_site” with any name you like.

gatsby new gatsby_site

Wait for a few moments, and a new “gatsby_site” directory is created.

Invoke the command below to develop Gatsby and run it.

cd gatsby_site

gatsby develop -H 0.0.0.0

You should be able to access your Gatsby site at ''http://YOUR_SERVER_IP_ADDRESS:8000'', press ''CTRL + C'' if you want to stop it.

Now, let’s build our Gatsby website:

gatsby build

The gatsby build command is a part of the Gatsby CLI. Run gatsby build command to create a production-ready version of your site when you are ready to publish your site. You can also deploy your Gatsby website to GitHub to set up a CI/CD (Continuous Integration and Continuous Deployment) pipeline.

==Install PM2==
Process Manager (PM2) will allow you to keep applications alive forever, reload them without downtime, and facilitate common system admin tasks. Invoke the command below to install PM2 on your Ubuntu 20.04 globally.

sudo npm install pm2 -g

After installing PM2, we can run these commands to start our Gatsby website on port 8000.

cd ~/gatsby-site

pm2 start gatsby --name mygatsby -- serve -p 8000

==Install and Configure NGINX==
Your Gatsby install has now been completed and you should be able to access it at your server’s public IP with port number 8000. However, if you want to access your Gatsby website using a domain name or subdomain name instead of typing the server’s IP address and the port number in the URL, you would need to configure a reverse proxy on your server.

In this step, we will show you how to implement the reverse proxy configuration using Nginx. Nginx is a powerful and high-performance web server that focuses on customization and performance.

First, install Nginx with the following command:

sudo apt install nginx

On Ubuntu 20.04, Nginx is configured to start running upon installation, you can check it by running this command:

sudo systemctl status nginx

Once installed, create a new Nginx server block configuration file. Replace yourdomain.com with your actual domain or subdomain name:

sudo nano /etc/nginx/sites-enabled/yourdomain.com.conf

Add the following content to the file:

server {

listen 80;

server_name yourdomain.com;
location / {
proxy_pass http://localhost:8000;
proxy_http_version 1.1;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Server $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_pass_request_headers on;
}
location ~ /.well-known {
allow all;
}
}

Save the file by pressing ''CTRL + O'' then press ''CTRL + X'' to exit the nano editor then restart [[Nginx]].

sudo systemctl restart nginx

==Source==
*[https://www.rosehosting.com/blog/how-to-install-gatsby-on-ubuntu-20-04/ rosehosting.com]

[[Category:Website]]
[[Category:CMS]]