How to Install NGINX on Ubuntu 20.04 and Host Website

NGINX is an open-source web server software. You can deploy NGINX as a standalone web server, or as a proxy in front of other web servers (in essence, reverse proxy). Nginx is one of the best web servers to host a high traffic website.

In this tutorial, we will focus on installing NGINX as a standalone web server on Ubuntu 20.04.

Install NGINX on Ubuntu 20.04

Firstly run sudo apt-get update to retrieve information about new and updated packages before you proceed to install NGINX.

Nginx is available in the Ubuntu package repository. So it's easy to install Nginx using the following command:

$ sudo apt-get install nginx

Check NGINX Service Status

Let us do a quick check to confirm the status of NGINX service, run the following command:

$ sudo systemctl status nginx

The output of the command above confirms that NGINX is active and running. If you get a message indicating that NGINX is inactive, not started, or not running, then you can manually start the NGINX service by running the following command.

$ sudo systemctl start nginx

To check the Nginx version, run:

$ sudo dpkg -l nginx

The output shows Nginx version 1.18.0 is running on Ubuntu 20.04, at the time of writing this tutorial.

Test the NGINX Web Server

After confirming that the NGINX service is active and running, you may now test the webserver by opening your preferred web browser and entering the IP address of your server (http://your_server_ip) on which NGINX is installed.

You should see the default web page titled, "Welcome to nginx!"

Also, confirm that the appropriate port is open on your firewall. For instance, if you have enabled the Uncomplicated Firewall (ufw) on your Ubuntu server, you should try to update the firewall rules to allow NGINX to communicate on port 80 and/or 443 as follows.

To allow NGINX on port 80:

$ sudo ufw allow 'Nginx HTTP'

To allow NGINX on port 443:

$ sudo ufw allow 'Nginx HTTPS'

Setup NGINX Server Blocks

If you would like to host multiple websites on the same NGINX web server, then you would need to setup server blocks. Server Blocks are also referred to as Virtual Hosts (mainly in Apache).

NGINX is preconfigured with just one server block and that is where configuration details for the default website (/etc/nginx/sites-available) are stored (/var/www/html).

Let's take a look.

$ sudo ls -l /etc/nginx/sites-available
total 8
-rw-r--r-- 1 root root 2416 Mar 26  2020 default

Run the following command to display the content of the default server block file.

$ sudo cat /etc/nginx/sites-available/default | more

Press the space bar on your keyboard to scroll down one page at a time. You will see that the file contains default server configuration details such as listen port number, document root (i.e. base folder for storing website contents,)  index file and server name.

You should also see a section titled Virtual Host configuration as shown below. You may configure your additional website here, but it is better to create a separate server block file and leave the default one as it is.

# Virtual Host configuration for example.com
#
# You can move that to a different file under sites-available/ and symlink that
# to sites-enabled/ to enable it.
#
#server {
#	listen 80;
#	listen [::]:80;
#
#	server_name example.com;
#
#	root /var/www/example.com;
#	index index.html;
#
#	location / {
#		try_files $uri $uri/ =404;
#	}
#}

In the meantime, copy the sample configuration information above and save it in a text editor. We will use this information soon.

Create website root

Next, you would need to create a root folder under /var/www to store the contents for your additional website. For example, I am going to create a folder named domain1.com for my domain1.com website.

Note: You should replace domain1 with your own registered domain name. You should also update the DNS records to point your domain name to the public IP address of your NGINX web server.

sudo mkdir /var/www/domain1.com

Create an index file

The index file is the main web page that is displayed when you open a website. Run the following command to create an index file for your additional website.

$ sudo nano /var/www/domain1.com/index.html

I am using nano in this example but you may use your favorite text editor. Next, you may copy and paste the following HTML code for testing purposes.

<!DOCTYPE html>
<html>
<head>
<title>Welcome to Domain1!</title>
<style>
body {
width: 35em;
margin: 0 auto;
font-family: Tahoma, Verdana, Arial, sans-serif;
}
</style>
</head>
<body>
<h1>Welcome to Domain1!</h1>
<p>If you see this page, the Domain1 website is working!</p>
</body>
</html>

Save changes and close the text editor.

Create a server block

The next step is to create a server block file to hold configuration details for the additional website. Run the following command.

$ sudo nano /etc/nginx/sites-available/domain1

Copy the sample virtual host configuration information which you saved earlier and paste it in the new file. Starting from "server" line, ensure to delete all # symbols to uncomment the directives. Also, remember to replace "domain1" with your own registered domain name accordingly.

# Virtual Host configuration for example.com
#
# You can move that to a different file under sites-available/ and symlink that
# to sites-enabled/ to enable it.
#
server {
       listen 80;
       listen [::]:80;

       server_name domain1.com www.domain1.com;

       root /var/www/domain1.com;
       index index.html;

       location / {
               try_files $uri $uri/ =404;
       }
}

Save changes and close this file.

Enable server block

To let NGINX know that the additional website is available, run the following command to create a symbolic link to the server block file.

$ ln -s /etc/nginx/sites-available/domain1 /etc/nginx/sites-enabled

Test your configuration

Run sudo nginx -t to test your server block configuration. You should see a message indicating that everything is ok.

$ sudo nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

You may run sudo service nginx reload to reload the configuration files.

Test your new website

Open a web browser and enter your new website address. You should see the content of the index file created for your new website, rather than the default NGINX web page.

Basic Commands to Control NGINX

Let's learn basic Nginx commands to manage your web server.

The restart command will stop the service and then start it again.

$ sudo systemctl restart nginx

The reload command tells NGINX to reload its configuration files but without stopping the service.

$ sudo systemctl reload nginx

The stop command will stop the NGINX service.

$ sudo systemctl stop nginx

To enable the Nginx service to start up at boot, run

$ sudo systemctl enable nginx

Note: By default, Nginx service is enabled to start automatically when the server boots up.

Basic NGINX Configuration & Log Files

/etc/nginx -- Contains all NGINX configuration files

/etc/nginx/sites-available -- Contains server block files which store configuration details for serving one or more websites

/etc/nginx/sites-enabled -- Contains configuration files for one or more enabled websites

/etc/nginx/nginx.conf -- Main configuration file which also reads configuration directives in other files

/var/log/nginx/access.log -- Default location for storing information about all visits to your website

/var/log/nginx/error.log -- Default location for storing NGINX errors

Conclusion

By following this guide, you should be able to get NGINX up and running with one or more websites on your Ubuntu 20.04 server. But if you encounter any issues, please feel free to let us know in the comments section below and we will do our best to help you.