Deploy Strapi App With SEO Plugin on Ubuntu 22.04

A CMS (Content Management System) is a software application that allows users to create, manage, and publish digital content, such as text, images, videos, and documents, without requiring advanced technical knowledge. Popular examples of CMS are WordPress, Drupal, Joomla, Magento, Shopify e.t.c

Strapi is an open-source headless CMS (Content Management System) that allows developers to build, deploy, and manage APIs and applications quickly and easily. With Strapi, developers can create APIs for web and mobile applications, e-commerce platforms, blogs, and more, all from a single, customizable platform.

Strapi provides a user-friendly dashboard for content management, making it easy for non-technical users to add, edit, and delete content without having to access the codebase directly. At the same time, Strapi’s API-first approach allows developers to use their favourite tools and frameworks to create customized applications and user interfaces.

One of the key benefits of Strapi is its flexibility and extensibility. Developers can easily integrate Strapi with other tools and services, such as databases, third-party APIs, and authentication systems, to create more complex and feature-rich applications.

Other features and benefits associated with Strapi are:

• Headless CMS: Strapi is an API-first CMS that separates content management from presentation, allowing developers to use their favourite tools and frameworks to create customized applications and user interfaces.
• Customizable content types: Strapi allows users to create custom content types and fields that can be tailored to specific business needs.
• User-friendly interface: Strapi provides a user-friendly dashboard for content management, making it easy for non-technical users to add, edit, and delete content without having to access the codebase directly.
• Role-based access control: Strapi provides granular role-based access control, allowing administrators to define permissions and access levels for different users and groups.
• Scalability: Strapi is built on Node.js and can be easily scaled horizontally to handle high traffic and large volumes of data.
• Security: Strapi provides various security features, including encryption, authentication, and authorization, to ensure that sensitive data is protected.

SEO stands for Search Engine Optimization. This is the practice of optimizing a website or online content to improve its visibility and ranking in search engine results pages (SERPs). This plugin on Strapi offers a lot of benefits. These include:

• Increased traffic and leads: It increases the quantity and quality of organic traffic to a website from search engines, such as Google, Bing, or Yahoo. SEO involves various techniques and strategies that aim to improve a website’s relevance and authority for specific keywords or phrases, making it more attractive and trustworthy to search engines and users alike.
• Analytics and reporting: SEO plugins provide various analytics and reporting tools that can help you monitor your website’s performance, track keyword rankings, and identify areas for improvement.
• Metadata optimization: SEO plugins can help you optimize your metadata, including titles, descriptions, and tags, which can improve your website’s click-through rates and search engine rankings.

This guide demonstrates how to deploy Strapi App on Ubuntu 22.04 With SEO Plugin. This guide requires you to have the following:

• Ubuntu 22.04 server with at least 4 GB RAM and 2 CPU cores
• Node.js version 16 and above.
• PostgreSQL installed
• Nginx web server
• Optional: An FQDN(domain name is pointed at your server’s public IP)

Step 1: Install and Configure PostgreSQL

Strapi supports several database servers, this includes MySQL, MariaDB, SQLite, and PostgreSQL. In this guide, we will use the PostgreSQL database. To install PostgreSQL on Ubuntu 22, follow the aid in the guide below:

• Install PostgreSQL 14 on Ubuntu 22.04 (Jammy Jellyfish)

Once installed, create a database for Strapi:

sudo -i -u postgres psql
CREATE DATABASE strapi_db;

Create the Strapi database user;

CREATE USER strapiuser WITH PASSWORD 'Your_Password';

Give ownership of the created database to the above user:

ALTER DATABASE strapi_db OWNER TO strapiuser;

Now exit the shell:

postgres-# \q

Verify if you can access the database with the user created:

$ psql --username strapiuser --password --host localhost strapi_db
Password: 
psql (14.7 (Ubuntu 14.7-1.pgdg22.04+1))
SSL connection (protocol: TLSv1.3, cipher: TLS_AES_256_GCM_SHA384, bits: 256, compression: off)
Type "help" for help.

strapi_db=> 

Step 2: Install NodeJS

The Strapi app is a Node.js application. For that reason, you need to have NodeJS installed on your system for it to run. To install Node.js, use the aid in the below guide:

• How To Install Node.js 16 on Ubuntu

Verify the installation:

$ node -v
v16.19.1

Step 3: Install Strapi App on Ubuntu 22.04

Once PostgreSQL and Node.js have been installed, we can proceed to install Strapi. We will begin by creating the Strapi project:

npx create-strapi-app@latest strapi-project

Proceed with the creation by pressing y. In the interactive shell, select custom installation then your database client, database name and user name as provisioned.

Ok to proceed? (y) y
? Choose your installation type Custom (manual settings)
? Choose your preferred language JavaScript
? Choose your default database client postgres
? Database name: strapi_db
? Host: 127.0.0.1
? Port: 5432
? Username: strapiuser
? Password: *************
? Enable SSL connection: No
....

Once complete, you will have the project “strapi-project” created. Navigate into it:

cd strapi-project

Now run the below command to build the project:

NODE_ENV=production npm run build

Sample Output:

This command should build the Strapi project, including the Strapi admin UI. To test if everything is working, start the Strapi server with the command:

node ~/strapi-project/node_modules/.bin/strapi start

Sample output:

From the above output, we see Strapi admin UI listening on port 1337.

To exit the server, press CTRL+C

Step 4: Install and Configure PM2

PM2 (Process Manager 2) is a popular and widely used process manager for Node.js applications. It allows developers to manage and monitor their Node.js applications, ensuring high availability, scalability, and performance.

We are using it here to avoid starting up our application manually thus ensuring uptime. To install PM2, use the commands:

cd ~
sudo npm install pm2@latest -g

Once installed, create a configuration file:

sudo vim ecosystem.config.js

In the opened file, add the lines:

module.exports = {
  apps: [
    {
      name: 'strapi',
      cwd: '/home/ubuntu22/strapi-project',
      script: 'npm',
      args: 'start',
      env: {
        NODE_ENV: 'production',
        DATABASE_HOST: 'localhost',
        DATABASE_PORT: '5432',
        DATABASE_NAME: 'strapi_db',
        DATABASE_USERNAME: 'strapiuser',
        DATABASE_PASSWORD: 'Your_Password',
      },
    },
  ],
};

Ensure that you have replaces all the variables correctly. Remember /home/ubuntu22/strapi-project is the path to my project, you are required to replace this with your own path before you proceed.

Once modified, save the file then start the app in the background with the command:

pm2 start ecosystem.config.js

Sample Output:

To allow the app to start automatically on boot, use the command:

$ pm2 startup
[PM2] Init System found: systemd
[PM2] To setup the Startup Script, copy/paste the following command:
sudo env PATH=$PATH:/usr/bin /usr/lib/node_modules/pm2/bin/pm2 startup systemd -u ubuntu22 --hp /home/ubuntu22

The command will generate a script to be executed on the system boot. Copy and execute the command:

sudo env PATH=$PATH:/usr/bin /usr/lib/node_modules/pm2/bin/pm2 startup systemd -u ubuntu22 --hp /home/ubuntu22

Save the process:

pm2 save

Step 5: Install and Configure Nginx

In this guide, we will configure Nginx reverse proxy for our Strapi App. Nginx exists in the default Ubuntu 22.04 repositories and can be installed with the command:

sudo apt update && sudo apt install nginx -y

Once installed, we need to secure our site so that we can access it via HTTPS and not HTTP. Here, there are two ways to proceed:

• Let’s Encrypt(Requires Public IPs/FQDN)
• Using Self-signed certs(Private IPs)

Option 1- Generate Let’s Encrypt Certs

Before you proceed with this step, you need to have a Fully Qualified Domain name. First, install the required packages:

sudo apt install certbot python3-certbot-nginx

Once installed, generate SSL certificates for your domain name

sudo certbot certonly --nginx --agree-tos --no-eff-email --staple-ocsp --preferred-challenges http -m [email protected] -d strapi.geeksforgeeks.org

Proceed and generate certificates for your FQDN.

Output
. . .
Successfully received certificate.
Certificate is saved at: /etc/letsencrypt/live/your_domain/fullchain.pem
Key is saved at: /etc/letsencrypt/live/your_domain/privkey.pem
This certificate expires on 2023-07-05.
These files will be updated when the certificate renews.
Certbot has set up a scheduled task to automatically renew this certificate in the background.

Deploying certificate
Successfully deployed certificate for your_domain to /etc/nginx/sites-enabled/your_domain
Successfully deployed certificate for www.your_domain /etc/nginx/sites-enabled/your_domain
Congratulations! You have successfully enabled HTTPS on https://your_domain and https://www.your_domain
. . .

Option 2- Generate Self-signed Certs

This method will work for those who do not have an FQDN. For this method, ensure that OpenSSL is installed before you proceed.

Create a configuration file for the certs:

$ vim strapi_ssl.conf
[req]
default_bits       = 2048
default_keyfile    = strapi_ssl.key
distinguished_name = req_distinguished_name
req_extensions     = req_ext
x509_extensions    = v3_ca

[req_distinguished_name]
countryName                 = Country Name (2 letter code)
countryName_default         = KE
stateOrProvinceName         = State or Province Name (full name)
stateOrProvinceName_default = Nairobi
localityName                = Locality Name (eg, city)
localityName_default        = Nairobi
organizationName            = Organization Name (eg, company)
organizationName_default    = Computingforgeeks
organizationalUnitName      = organizationalunit
organizationalUnitName_default = Development
commonName                  = strapi.geeksforgeeks.org
commonName_default          = Your_IP-Address
commonName_max              = 64

[req_ext]
subjectAltName = @alt_names

[v3_ca]
subjectAltName = @alt_names

[alt_names]
DNS.1   = localhost
DNS.2   = Your_IP-Address

Replace all the values where required before you generate the certs with the command:

openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout strapi_ssl.key -out strapi_ssl.crt -config strapi_ssl.conf

Press Enter to the end to generate the certs. Copy these certs to the /etc/ssl/certs directory as shown.

sudo cp strapi_ssl.crt /etc/ssl/certs/strapi_ssl.crt
sudo mkdir -p /etc/ssl/private/
sudo cp strapi_ssl.key /etc/ssl/private/strapi_ssl.key

Configure Nginx Reverse Proxy

The last thing is to create a virtual host for our site

sudo vim /etc/nginx/conf.d/strapi.conf

In the file, add the lines below:

server {
  # Redirect any http requests to https
  listen         80;
  listen         [::]:80;
  server_name    strapi.computinforgeeks.com;
  return 301     https://$host$request_uri;
}

server {
  listen                    443 ssl http2;
  listen                    [::]:443 ssl http2;
  server_name               strapi.geeksforgeeks.org;

  access_log                /var/log/nginx/strapi.access.log;
  error_log                 /var/log/nginx/strapi.error.log;

  # TLS configuration
  ssl_certificate /etc/ssl/certs/strapi_ssl.crt;
  ssl_certificate_key /etc/ssl/private/strapi_ssl.key;
  ssl_protocols             TLSv1.2 TLSv1.3;

  ssl_prefer_server_ciphers on;
  ssl_session_cache         shared:SSL:50m;
  ssl_session_timeout       1d;

  # OCSP Stapling ---
  # fetch OCSP records from URL in ssl_certificate and cache them

  location / {
    proxy_set_header        X-Real-IP $remote_addr;
    proxy_set_header        X-Forwarded-Proto $scheme;
    proxy_set_header	    X-Forwarded-Host $http_host;
    proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_pass              http://127.0.0.1:1337;
  }
}

If you used Let’s Encrypt, provide the exact path to the SSL certs here. Save the file and restart Nginx:

sudo systemctl restart nginx

If you have UFW enabled, can deny the Strapi port and allow Nginx only:

sudo ufw deny 1337/tcp
sudo ufw allow 'Nginx Full'

Step 6: Access and Use Strapi App

Now you are set to access and use the Strapi App. Access it from your favourite browser using the URL https://domain_name

Navigate to the admin site with the URL https://domain_name/admin

Create an admin account and proceed to the below dashboard.

Now you are set to use the Strapi App. We will begin by installing the SEO plugin. So navigate to the marketplace

This will give you a guide on how to install the SEO plugin.

From your shell, execute the below command to install the SEO plugin.

cd ~/strapi-project
npm install @strapi/plugin-seo

Once complete, create the below file:

$ vim config/plugins.js
module.exports = ({ env }) => ({
  // ...
  seo: {
    enabled: true,
  },
  // ...
});

Save the file and rebuild build the admin panel.

NODE_ENV=production npm run build

Once build, the SEO plugin will be added to your site.

To make desired settings to Strapi, navigate to the settings tab.

Another important thing is the API tokens. They allow execution of requests on the Strapi;s REST API endpoints as an authenticates user. To generate a token, navigate to the settings tab.

Creating an API token is simple, provide the name, description and permissions for the token. Once created, the token will be available as shown. Copy this as it will not appear again.

Conclusion

Today, we have walked through how to deploy Strapi App on Ubuntu 22.04 With SEO Plugin. Strapi is a powerful and versatile tool that can help developers create robust, scalable, and customizable digital experiences. Additionally, Strapi provides extensive documentation and a supportive community to help you get started and resolve any issues you may encounter.

Related posts:

How To Run Ghost CMS in Docker Containers

How To Install Drupal 10 CMS on Debian

How To Setup Bolt CMS on Ubuntu

Install and Configure October CMS on CentOS 8