05/22/2023

How to setup Nginx server blocks for multiple sites - Ubuntu

Setting up nginx server blocks is a process that allows you to host multiple websites on a single server. It is a useful technique for those who want to host multiple websites or applications on a single machine, as it allows you to use a single IP address and port to host multiple domains. In this article, we will explain how to set up nginx server blocks on a Ubuntu server.

Nginx Logo

Prerequisites

Step 1

Allow Nginx to pass through your firewall.

sudo ufw allow 'Nginx HTTP'

Replace

Replace with your domain name to auto generate the correct commands for your system.

Step 2

Create a directory for your site and configuration files.

sudo mkdir -p /var/www/domain.sh/html

Set the ownership of the directory to the $USER environment variable.

sudo chown -R $USER:$USER /var/www/domain.sh/html

This allows you to read, write, and execute the files and lets other users read and execute files.

sudo chmod -R 755 /var/www/domain.sh

Make a sample page in the directory you just created.

sudo nano /var/www/domain.sh/html/index.html

Add this sample HTML file

html
<html>
    <head>
        <title>Welcome to domain.sh!!</title>
    </head>
    <body>
        <h1>Success!  The example.com server block is working!</h1>
    </body>
</html>

Step 3

Creating the server block

sudo nano /etc/nginx/sites-available/domain.sh

Add this to the created file. Change the www to any sub-domain you want.

Port:

Replace with the correct port you want to be set.

nginx
server {
        listen 80;
        listen [::]:80;

        root /var/www/domain.sh/html;
        index index.html index.htm index.nginx-debian.html;

        server_name domain.sh;

        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;
        }
}

Once added save the file and then we need to link the configuration file to the sites-enabled directory

sudo ln -s /etc/nginx/sites-available/domain.sh/etc/nginx/sites-enabled/

This will keep both configuration files in sync between sites-available and sites-enabled

Next to prevent a possible hash bucket memory problem, open /etc/nginx/nginx.conf.

sudo nano /etc/nginx/nginx.conf

un-comment the line below in the http block

server_names_hash_bucket_size 64;

Step 4

Now everything should be set up, you can run the command to make sure all the formatting is done properly.

sudo nginx -t

If no warning show up you are good to restart the server.

sudo systemctl restart nginx

Setting up multiple sites

To configure more than one domain on the same server just repeat steps 2-4.

Next learn how to set up Node.JS for production.

Setting up Node.JS for Production

Back

Comments


Be the first to comment!

Read More

HTTP Headers - Basics

HTTP headers are a crucial part of the HTTP protocol, which is used to transmit data over the internet. These headers are used to provide additional information about the request or...

Dynamically loading Google Fonts

Google Fonts is a great tool for web developers, it allows you to load in almost any font on to you website and use it with only a few lines of cod...

Javascript Loops

Loops are one of the most valuable tools in any programmer's arsenal, and Javascript is no exception. Loops allow you to execute the same code multiple times with different values, making them a great way to deal with repetitive tasks. There are three main types of ...

Install PicoCSS with Svelte

Pico CSS is a classless CSS framework that auto add styles to default HTML elements allowing you to effortlessly build beautiful websites. Here's how to install and use it in Svelte or SvelteKit.