DEV Community

Cover image for How to Configure NGINX, and Host Your Local Website on Ubuntu Installed on VMware
JICDev
JICDev

Posted on

How to Configure NGINX, and Host Your Local Website on Ubuntu Installed on VMware

Introduction

This guide walks through my full journey of:

  • Enabling copy-paste and VMware Tools
  • Installing and configuring NGINX
  • Hosting a local HTML website
  • Fixing common Linux/VMware errors

Every problem I faced is documented, including why it happened and how to fix it.

You can follow this tutorial even as a complete beginner.

1. Installing Ubuntu on VMware

After downloading the Ubuntu ISO and creating a new VMware virtual machine, the installation completed successfully.

However, I immediately noticed something was wrong:

  • Copy/paste did not work from Windows → Ubuntu neither from Ubuntu → Windows

This usually means VMware Tools is missing or not properly installed.


2. Installing and Verifying VMware Tools

Run

sudo apt update
sudo apt install open-vm-tools open-vm-tools-desktop -y
Enter fullscreen mode Exit fullscreen mode

To first update your VM and then install the tools.

Then I rebooted the VM with

sudo reboot
Enter fullscreen mode Exit fullscreen mode

To check if VMware Tools was installed, I ran:

vmware-toolbox-cmd -v
Enter fullscreen mode Exit fullscreen mode

Correct output (after installation)

12.5.0.51152 (build-24276846)
Enter fullscreen mode Exit fullscreen mode

What happened initially

At first, copy/paste only worked in one direction. This confirmed that VMware Tools needed to be installed.

Fix

From VMware:

VM → Install VMware Tools
Enter fullscreen mode Exit fullscreen mode

Ubuntu mounted the VMware Tools installer. After installation and a reboot, two-way copy/paste worked correctly.

Why VMware Tools matters

  • Enables clipboard sharing
  • Enables drag-and-drop
  • Improves display resolution
  • Improves VM performance

3. Installing NGINX

Before installation, I updated Ubuntu:

sudo apt update && sudo apt upgrade -y
Enter fullscreen mode Exit fullscreen mode

Then installed NGINX:

sudo apt install nginx -y
Enter fullscreen mode Exit fullscreen mode

Check the installed version:

nginx -v
Enter fullscreen mode Exit fullscreen mode

Start NGINX:

sudo systemctl start nginx
Enter fullscreen mode Exit fullscreen mode

Enable at boot:

sudo systemctl enable nginx
Enter fullscreen mode Exit fullscreen mode

At this point, visiting the VM IP address in a browser should show the default NGINX welcome page.


4. Hosting a Local Website with NGINX

I decided to host a simple website from this directory:

/var/www/myresume
Enter fullscreen mode Exit fullscreen mode

Creating the directory

sudo mkdir -p /var/www/myresume
Enter fullscreen mode Exit fullscreen mode

Assigning permissions

sudo chown -R $USER:$USER /var/www/myresume
Enter fullscreen mode Exit fullscreen mode

Creating the HTML File

nano /var/www/myresume/index.html
Enter fullscreen mode Exit fullscreen mode

You would notice in the image above I imputed it all together! Linux terminal allows you run multiple commands at a time.

Inside the file "nano /var/www/myresume/index.html":

<h1>My Resume Website</h1>
<p>Hosted locally on Ubuntu using NGINX.</p>
Enter fullscreen mode Exit fullscreen mode

You could use whatever website template you have available or prefer. This sould be imputed in the editor
Save and exit:

  • CTRL + O = save
  • ENTER = save name
  • CTRL + X = exit

Important Mistake I Made

At first, I accidentally typed:

/var/www/myreusme
Enter fullscreen mode Exit fullscreen mode

Because of this typo, NGINX could not find the correct directory and displayed:

404 Not Found
nginx/1.24.0 (Ubuntu)
Enter fullscreen mode Exit fullscreen mode

I confirmed the issue with:

ls -l /var/www/myresume
ls -l /var/www/myreusme
Enter fullscreen mode Exit fullscreen mode

The second path did not exist, confirming the error.

Fixing the directory name resolved the issue.


5. Configuring NGINX to Serve the Website

Create a server block:

sudo nano /etc/nginx/sites-available/myresume
Enter fullscreen mode Exit fullscreen mode

Add:

server {
    listen 80;
    server_name _;

    root /var/www/myresume;
    index index.html;

    location / {
        try_files $uri $uri/ =404;
    }
}
Enter fullscreen mode Exit fullscreen mode

Enable the site:

sudo ln -s /etc/nginx/sites-available/myresume /etc/nginx/sites-enabled/
Enter fullscreen mode Exit fullscreen mode

Test configuration:

sudo nginx -t
Enter fullscreen mode Exit fullscreen mode

Reload NGINX:

sudo systemctl reload nginx
Enter fullscreen mode Exit fullscreen mode


6. Testing the Website

Get the VM IP address:

ip a
Enter fullscreen mode Exit fullscreen mode

Mine was:

192.168.107.13?
Enter fullscreen mode Exit fullscreen mode

Test in browser:

http://192.168.107.13?
Enter fullscreen mode Exit fullscreen mode

It loaded correctly.


7. Real Errors I Encountered (And How I Fixed Them)

Error: 404 Not Found

Cause:
Incorrect directory name due to a typo (myreusme instead of myresume).

Fix:
Corrected the folder name and HTML file path.


Error: curl not found

When testing:

curl http://192.168.107.13?
Enter fullscreen mode Exit fullscreen mode

I got:

Command 'curl' not found
Enter fullscreen mode Exit fullscreen mode

Fix:

sudo apt install curl -y
Enter fullscreen mode Exit fullscreen mode

Warning: NGINX config changed on disk

Warning: The unit file or drop-ins changed on disk
Run 'systemctl daemon-reload'
Enter fullscreen mode Exit fullscreen mode

Fix:

sudo systemctl daemon-reload
sudo systemctl restart nginx
Enter fullscreen mode Exit fullscreen mode

8. Final Verification

Browser test: success
curl test: success
Nginx reload: success
VM tools: fully working

The website was now being served perfectly from NGINX.


Conclusion

In this project, I learned:

  • How to install Ubuntu on VMware
  • How to verify and install VMware Tools
  • How to install and manage NGINX
  • How to host a website locally
  • How to debug directory issues, missing tools, and configuration errors

By documenting all the mistakes I made, I hope this guide saves others time and frustration.

Top comments (0)