DEV Community

Cover image for Production deployment Strapi + Gatsby app on VPS Shared Hosting: installing Node & Creating configs. (2)
Daniel Krupnyi
Daniel Krupnyi

Posted on

Production deployment Strapi + Gatsby app on VPS Shared Hosting: installing Node & Creating configs. (2)

Welcome to the second part of the production deployment of the Strapi + Gatsby app on VPS Shared Hosting! ๐Ÿ™Œ


Before install Node, you need to connect to the server over SSH. You can find all the data for connecting via SSH on your host.

So, in your terminal enter:

shh root@00.0.000.000
Enter fullscreen mode Exit fullscreen mode

Instead "00.0.000.000" enter your server IP. After enter password.

Installing Node

In order to install Node, you need to find out what OS installed on the your server.

In different hosts it can be find out on different ways.
So, you need to find out it in your case ๐Ÿค—

In my case, the server had Cent OS installed and I'll show you how I installed Node on this OS.

For different OS Node has some great documentation ๐Ÿ‘

let's continue.

First install yum:

curl -sL https://rpm.nodesource.com/setup_10.x | sudo bash -
Enter fullscreen mode Exit fullscreen mode

Then install Node:

sudo yum install nodejs
Enter fullscreen mode Exit fullscreen mode

That's it!
You can check out the Node version:

node --version
Enter fullscreen mode Exit fullscreen mode

Adding new domain and subdomain

To add a domain to VestaCP you must:
Log in to control panel and go to the section Web.
vesta menu
In the upper left corner click on Add Web Domain. Fill in all the required fields and click Add.
add domain
Also you need to create a subdomain. The procedure for creating a subdomain is the same as for a domain.

When you're enter your domain name, you need to write "admin." in front of it.
It looks like this: admin.your-domain.com.

In the future, we will install the Strapi backend on a subdomain.

Adding template for nginx in VestaCP

Templates for nginx on a server with VestaCP installed are stored along the path: /usr/local/vesta/data/templates/web/nginx/.

Each template must be provided in two formats:

  1. *.tpl - for http
  2. *.stpl - for ssl(https)

The file names must be the same.

Let's create them:

nodeproxy.stpl

server {
  listen   %ip%:%proxy_port%;
  server_name %domain_idn% %alias_idn%;
  error_log /var/log/%web_system%/domains/%domain%.error.log error;

  location /error/ {
    alias  %home%/%user%/web/%domain%/document_errors/;
  }

  location @fallback {
    proxy_pass   http://%ip%:%web_port%;
  }

  location ~ /\.ht  {return 404;}
  location ~ /\.svn/ {return 404;}
  location ~ /\.git/ {return 404;}
  location ~ /\.hg/  {return 404;}
  location ~ /\.bzr/ {return 404;}

  include %home%/%user%/conf/web/nginx.%domain%.conf*;
}
Enter fullscreen mode Exit fullscreen mode

nodeproxy.tpl

server {
  listen   %ip%:%proxy_port%;
  server_name %domain_idn% %alias_idn%;
  error_log /var/log/%web_system%/domains/%domain%.error.log error;

  location /error/ {
    alias  %home%/%user%/web/%domain%/document_errors/;
  }

  location @fallback {
    proxy_pass   http://%ip%:%web_port%;
  }

  location ~ /\.ht  {return 404;}
  location ~ /\.svn/ {return 404;}
  location ~ /\.git/ {return 404;}
  location ~ /\.hg/  {return 404;}
  location ~ /\.bzr/ {return 404;}

  include %home%/%user%/conf/web/nginx.%domain%.conf*;
}
Enter fullscreen mode Exit fullscreen mode

After adding a template in the domain settings panel, you need to select a template for nginx:
domain settings panel
All the above steps must be repeated for the subdomain.

After editing the nginx configurations, it must be restarted for the changes to take effect!

For that go to the "Server" on top menu of VestaCP:
top menu
There you'll see nginx. Move mouse on it end click restart.

Nginx configuration

After applying the template for nginx, configuration files will be automatically generated under the path /home/{username}/conf/web. Let's take a closer look at the contents of the template, namely, we are interested in the line:

include /home/username/conf/web/nginx.example.com.conf*;
Enter fullscreen mode Exit fullscreen mode

Since nginx configuration files are dynamic, we cannot change their content, otherwise we will lose the changes after regenerating the template. But we can create an nginx.example.com.conf* file to be extracted. It is worth noting that we only have access to the server block of the configuration file, since include is done there. This is done because the server block should be generated automatically and have basic settings.

So let's create files for main domain:

snginx.example.com.conf*

Empty
Enter fullscreen mode Exit fullscreen mode

nginx.example.com.conf*

if ( $scheme = "http" ) {
 rewrite ^/(.*)$ https://$host/$1 permanent;
}
Enter fullscreen mode Exit fullscreen mode

The code above redirects the request from http to https.

Now create files for subdomain:

snginx.admin.example.com.conf*

location / { 
  proxy_pass http://00.0.000.000:1337;
}
Enter fullscreen mode Exit fullscreen mode

Instead 00.0.000.000 your server IP.

nginx.admin.example.com.conf*

if ( $scheme = "http" ) {
 rewrite ^/(.*)$ https://$host/$1 permanent;
}
Enter fullscreen mode Exit fullscreen mode

That's it! ๐Ÿ˜ž

In next part we will deploy Gatsby and Strapi, create web hooks and install pm2.

If you want to add something, drop it in the comments๐Ÿ‘‡๐Ÿป

Top comments (2)

Collapse
 
mostafaalzoubi1994 profile image
MostafaALZOUBI1994

Thank you very very much i really need this article brooo.. i'm waiting you to complete the series..
can i deploy strapi like any nodejs project ??????

Collapse
 
danielkrupnyi profile image
Daniel Krupnyi

Hi! I am very glad I can help you with this article. I'm currently working on the last part. I'll post it soon. Yes, Strapi is also a Node application and its installation is the same.