Install an NGINX web server on Ubuntu and create a website!

Terminals & Coffee
6 min readJan 17, 2023

--

Welcome back to my blog everyone! I haven’t posted much lately but that is about to change. This is my first of many blogs with Level Up in Tech. In this lab, I will be going over how to install a webserver using Ubuntu and NGINX (pronounced as “Engine-X”, I had to google that myself 😅). As in my previous labs, I will use A Cloud Guru’s website to spin up a Virtual Machine.

Scenario:
As a new Linux Admin, your team wants to test a webpage out on their test Linux server.

They would like to see if they can access the page over the internet. Your job is to install the test web server that will serve up the webpage for your team.

Lab Guide: We are going to use an Ubuntu 18.04 LTS Server

  1. Update all packages on the server
  2. Install an NGINX Web Server
  3. Enable the NGINX Web Server
  4. Grab the public IP of your server and send it to your coach to verify if we can access that test webpage over the internet!

5. ADVANCED:
Create an HTML page that displays “Welcome to LUIT — <Team Name>”

6. COMPLEX:
Create and execute a bash script that does all of this to automate the process.

So why Ubuntu?

Ubuntu is one of the most popular Linux servers you can find today and has a long list of benefits. There is a reason why 10967 companies reportedly use Ubuntu in their tech stacks, including Instacart, Robinhood, and Slack. (https://stackshare.io/ubuntu#:~:text=Who%20uses%20Ubuntu%3F&text=11009%20companies%20reportedly%20use%20Ubuntu,Instacart%2C%20Robinhood%2C%20and%20Slack.)

Some of the main benefits include:

  • It is a free and open-source operating system, which means that users can modify and distribute the source code as they see fit.
  • Ubuntu has a large software repository containing thousands of free and open-source software packages.
  • Ubuntu is compatible with a wide range of hardware and can run on both desktops and servers, making it a versatile operating system.

Fun Fact: Ubuntu is an ancient African word meaning ‘humanity to others.’ It also means ‘I am what I am because of who we all are’

CC: https://www.clariontech.com/blog/nginx-php-fpm-setup-for-high-traffic-web-sites

Why use NGINX?

NGINX is a popular webserver (similar to Apache) that is used on Linux servers. It has often been used as a reverse proxy, load balancer, and its ability to cache HTTP. Some reasons to choose NGINX over other web servers is because of its performance, load balancing, reverse proxy, HTTP caching, security, and a few others. You can find more information on their website: https://www.nginx.com/

Installing NGINX

The first step we want to take on our Ubuntu Server before installing NGINX is to update the local package index with the latest changes made in the repositories, this is also a good practice to have for any installation. This will update the newest versions of software packages available, including any dependencies. After that, we can proceed with installing NGINX.

Let’s begin! After logging into your server (SSHing) you will run the following commands.

sudo apt update -y

sudo apt install -y nginx

To enable NGINX run the following two commands:

System ctl enable nginx

Systemctl start nginx

Note: Ubuntu now automatically enables and starts NGINX. We can run the below command to see if it is installed and running.

systemctl status nginx

We can also place our public IP into any web browser, and we should see the following!

That’s it! It’s that simple to create a web server within Linux. If you are looking for something more advanced, then continue below.

Advanced:

Our next step will be to create a website.

The default HTML page is in the directory: /var/www/html

You can place static pages here, or use ‘virtual host’ and place it in another location.
note: Virtual host is a method of hosting multiple domain names on the same server.

Instead of editing the default HTML file, we will create our own.

Let’s go back to one directory and create a new one.

Whoops! Looks like we needed sudo permission int order to do that.

sudo mkdir /var/www/<filename>

sudo vi /var/www/nginxweb/index.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> Welcome to LUIT – Gold Team!</title>
</head>
<body>
<h1> Welcome to LUIT – Gold Team!!!</h1>
<p>We have just configured our Nginx web server on Ubuntu Server!</p>
</body>
</html>

Note: Once you are done pasting, hit the “Esc” key, then type “:wq” to Write and Close the file. I had to write that on a sticky note and place it on my monitor LOL

The HTML code is what is displayed on our website, now we will need to set up a Virtual Host text file. This will allow connection to the website over the web.

We will create a text file named nginxweb within the /etc/nginx/sites-enabled/ directory with the following command:

sudo vi /etc/nginx/sites-enabled/nginxweb

Then, paste in the following. Note, you must edit the server name before pasting.

server {
listen 80;
listen [::]:80;
server_name www.example.com example.com;
server_name <your_public_IP>;
root /var/www/nginxweb;
index index.html; location / {
try_files $uri $uri/ =404;
}
}

You will exit out of vim just as you did previously.

hmm… looks like I did something wrong…

I kept getting this error.

I even stayed up past my bedtime because I could not figure out what I did wrong! LOL I actually deleted the whole server and started from scratch and renamed the file ngnixweb instead of rafsnginx … This did not resolve the issue.

After doing some research, I came across a Youtube video that stated there must be a typo in the Virtual Host text file. I thought, there is no typo so what could it be? Another 30+ minutes went by and with continuous trial and error, I found out that if I swapped the FQDN with the public IP it now works!

Phew! I’m glad I got to showcase that things don’t always go as smoothly as you want them to and some simple troubleshooting can put us right back on track.

That completes our advanced portion of this lab. If you are still not satisfied and want to move on to something even more advanced, continue to the next section.

Complex:

Create and execute a bash script that automates this process.

#!/bin/bash

# Update all packages on the server
apt-get update
apt-get upgrade -y

# Install NGINX Web Server
apt-get install nginx -y

# Enable NGINX Web Server
systemctl enable nginx
systemctl start nginx

You can run this script by saving it to a file with a .sh extension, making the file executable with:

chmod +x <script-name>.sh

And running it with:

sudo ./<script-name>.sh

You should see similar output if the script ran successfully.

That does it for our complex portion as well!

Thank you for following along. I hope you learned something and will continue to visit my blog, there will be many more blogs pertaining to AWS in the near future!

--

--