How to install Strapi on Ubuntu 20.04 LTS

Strapi is an open-source headless CMS based on Node.js that meets all application programming interface and content management needs while saving developers time. It lets you create functional APIs in minutes and develop without the hassle of CMS complexities, giving you the freedom to use your tools and frameworks. Strapi also lets content editors optimize content delivery (text, images, video, etc.) on any device.

This article explains how to install Strapi and configure NGINX to set up a reverse proxy with SSL on a server running Ubuntu 20.04 LTS

Installing Strapi

Download and run the Node.js script to add the repository:

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

And install Nodejs using apt:

# apt-get install -y nodejs

Next, check that the installed version is Nodejs v14 along with npm:

# node -v && npm -v

Additionally, we recommend installing some dependencies:

# apt-get install build-essential

Then, install Strapi with npm:

# npm install strapi@latest

Now you can create your project:

# npx create-strapi-app@latest mi-proyecto --no-run

Once it has finished installing the packages, it will ask which installation type you want; choose Quickstart (recommended) by pressing Enter:

? Choose your installation type (Use arrow keys)
❯ Quickstart (recommended)
  Custom (manual settings)

It will create the project directory and the Strapi application inside it, and install dependencies:

Creating a quickstart project.
Creating a new Strapi application at /root/Mi_Proyecto.
Creating files.
Dependencies installed successfully.

Your application was created at /root/mi-proyecto.

Available commands in your project:

  npm run develop
  Start Strapi in watch mode. (Changes in Strapi project files will trigger a server
  restart)

  npm run start
  Start Strapi without watch mode.

  npm run build
  Build Strapi admin panel.

  npm run strapi
  Display all available commands.

You can start by doing:

  cd /root/mi-proyecto
  npm run develop

Next, go to the newly created directory for the project:

# cd mi-proyecto

You can check the version of Strapi installed:

# npm run strapi version

4.1.0

Then, to set up a reverse proxy and configure HTTPS, install Certbot and NGINX:

# apt install python3-certbot-nginx -y

Create the site configuration file in NGINX for Strapi:

# vi /etc/nginx/sites-available/strapi.conf

With the following content (replace the example server_name with your DNS record):

server {

    listen 80;
    server_name api.ejemplo.com;

    # Proxy configuration
    location / {
        proxy_pass http://localhost:1337;
        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;
    }
}

Create a symbolic link for the site:

# ln -s /etc/nginx/sites-available/strapi.conf /etc/nginx/sites-enabled/strapi.conf

Verify the configuration created for NGINX:

# nginx -t

If it is correct, reload the configuration for NGINX:

# systemctl reload nginx

Next, edit the configuration file for the Strapi project:

# vi ./config/server.js

To add the url line for the DNS record:

module.exports = ({ env }) => ({
  host: env('HOST', '0.0.0.0'),
  port: env.int('PORT', 1337),
  url: 'https://api.dominio.com',
  app: {
    keys: env.array('APP_KEYS'),
  },
});

And use Certbot to obtain the certificate for the DNS record:

# certbot --nginx --redirect -d api.dominio.com

And start Strapi in watch mode (changes to the Strapi project files will trigger an application restart):

# npm run develop

The following output will appear:

Running your Strapi application.

  > mi-proyecto@0.1.0 develop
  > strapi develop

  Building your admin UI with development configuration ...
  Admin UI built successfully
  [2022-02-17 20:53:03.763] info: The Users & Permissions plugin automatically
  generated a jwt secret and stored it in your .env file under the name JWT_SECRET.

Project information
  ┌────────────────────┬──────────────────────────────────────────────────┐
  │ Time               │ Thu Feb 17 2022 20:53:05 GMT+0100 (Central Euro… │
  │ Launched in        │ 2524 ms                                          │
  │ Environment        │ development                                      │
  │ Process PID        │ 10751                                            │
  │ Version            │ 4.1.0 (node v14.19.0)                             │
  │ Edition            │ Community                                        │
  └────────────────────┴──────────────────────────────────────────────────┘

Actions available

  One more thing...
  Create your first administrator 💻 by going to the administration panel at:
  ┌────────────────────────────────────┐
  │ https://api.ejemplo.com/admin │
  └────────────────────────────────────┘

Then, use a web browser to access the DNS record you configured:

Click "Create the first administrator" to set up your administrator account for Strapi:

Once the administrator account is created, the Strapi Dashboard will appear and you can start building your project:

Please note that the Strapi developers recommend using pm2 to manage a project in production. PM2 is a production process manager for Node.js applications with a built-in load balancer. It lets you keep applications running, reload them without downtime, and simplify common system administration tasks.

We hope this tutorial has helped you. Have you tried it? Leave us your comments! 🙂

Remember, if you have questions about this or any other issue related to your servers on Clouding, feel free to write to soporte@clouding.io We're here for whatever you need!