Framecast AI

Server Setup

To deploy Framecast AI to production on any sort of custom server, we're going to go through some of the steps to setup the server accordingly. First up, we have to setup Nginx. Let's start.

Terminal

cd "source code"

Nginx Setup

To ensure proper setup, follow the steps given below:

Connect to your VPS through `SSH`

In your terminal, enter the following command to connect to your VPS through SSH:

Terminal

ssh root@your_server_ip

Install Nginx

Install Nginx using your terminal, this may take a moment:

Terminal

sudo apt update && sudo apt upgrade

Terminal

sudo apt install nginx

Now we need to adjust our Firewall. we can see the Firewall app list by using this command:

Terminal

sudo ufw app list

You should get a list of the applications like this:

Output

Available applications:
Nginx Full
Nginx HTTP
Nginx HTTPS
OpenSSH

We only need to allow traffic on port 80 and port 443. You can do this by typing:

Terminal

sudo ufw allow "Nginx HTTP"
sudo ufw allow "Nginx HTTPS"

Next up, we can enable our Firewall by typing:

Terminal

sudo ufw enable

Let's check the status of our Firewall:

Terminal

sudo ufw status

An output like this will be visible to you:

Output

Status: active
To Action From
 - - - - - -
OpenSSH ALLOW Anywhere
Nginx HTTP ALLOW Anywhere
OpenSSH (v6) ALLOW Anywhere (v6)
Nginx HTTP (v6) ALLOW Anywhere (v6)

Now let’s check with the systemd init system to make sure the service is running by typing:

Terminal

systemctl status nginx

Our service has started successfully, we can test it by requesting a page from Nginx. We can visit the Nginx default landing page by entering your VPS IP address into your browser’s address bar:

Browser

http://your_vps_ip_address

If you don’t know your IP address you can find it by using ipinfo.io by typing:

Terminal

curl ipinfo.io

An output like this will be visible afterwards:

Output

{
  "ip": "your_VPS_ip_addrs",
  "city": "#########",
  "region": "#######",
  "country": "##",
  "loc": "######,####",
  "org": "#######",
  "postal": "####",
  "timezone": "America/New_York",
  "readme": "https://ipinfo.io/"
}

Configure Nginx As A Reverse Proxy

Start by creating a new Nginx configuration file for Framecast AI:

Terminal

sudo nano /etc/nginx/sites-enabled/nextjs.conf

Paste the following configuration, replacing your_domain_name with your domain name:

Nginx

server {
    listen 80;
    server_name your_domain_name www.your_domain_name;
    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

Save and close the file. you can save the file by clicking ctrl+o. Now let’s remove the default conf file by typing:

Terminal

sudo rm /etc/nginx/sites-enabled/default

Lastly, restart Nginx:

Terminal

sudo systemctl restart nginx

Installing NodeJS On Our Server

We can install NodeJS by typing:

Terminal

sudo apt-get update && sudo apt-get install -y ca-certificates curl gnupg
curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key | sudo gpg - dearmor -o /etc/apt/keyrings/nodesource.gpg
NODE_MAJOR=20
echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_$NODE_MAJOR.x nodistro main" | sudo tee /etc/apt/sources.list.d/nodesource.list
sudo apt-get update && sudo apt-get install nodejs -y

We can check if we have properly installed Nodejs by typing:

Terminal

node

If you have installed NodeJS properly, you will see the NodeJS output like below:

Output

Welcome to Node.js v21.1.0.
Type ".help" for more information.
>

Installing Docker And Docker Compose

Before proceeding with the server setup, install Docker and Docker Compose, Type them one by one:

Terminal

# Install Docker
curl -fsSL https://get.docker.com -o get-docker.sh
sudo sh get-docker.sh
 
# Install Docker Compose
sudo curl -L "https://github.com/docker/compose/releases/download/v2.23.0/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
sudo chmod +x /usr/local/bin/docker-compose
 
# Start and enable Docker service
sudo systemctl start docker
sudo systemctl enable docker
 
# Verify installations
docker --version
docker-compose --version

This completes our initial setup of the server. Next up, we will be setting up the environment variables.

Custom Server Environment Environment Variables

Server Setup

Nginx Setup

Connect to your VPS through SSH

Install Nginx

Configure Nginx As A Reverse Proxy

Installing NodeJS On Our Server

Installing Docker And Docker Compose

Connect to your VPS through `SSH`