Creating Website/Webpage on Apache2 – Ubuntu

In this chapter, you will learn

  1. How to host webpage on Apache2 Web server on Ubuntu?
  2. How to change location of DocumentRoot folder

After installing and setting up Apache2 on your Ubuntu web server, it is time to create a demo website and webpage and render it on your web browser.

In this article, we are going to create a simple html page and host them into Apache2 web server.

Where to host website on Apache2 web server?

The default location for hosting a website on the Apache2 web server is /var/www/html. However, you can change the location according to your needs by modifying the DocumentRoot in the /etc/apache2/sites-enabled/000-default.conf file.

Change location

sudo vi /etc/apache2/sites-enabled/000-default.conf
# The ServerName directive sets the request scheme, hostname and port that # the server uses to identify itself. This is used when creating ServerAdmin webmaster@localhost DocumentRoot /var/www/html #DocumentRoot /var/www/

Creating first website

Create a directory inside /var/www/html folder and it will be considered your website name.

Step 1: Create a folder easycodelab.com inside /var/www/html folder.
cd /var/www/html

$sudo mkdir easycodelab.com

$cd easycodelab.com
Step 2: Create index.html file and paste the following html code.
sudo vi index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Simple HTML Page</title> </head> <body> <h1>Hello, World!</h1> <p>This is a simple HTML page.</p> </body> </html>
Step 3: Save and Exit. Press Esc → Type :wq → Press Enter.
Step 4: Start Apache server.
sudo systemctl start apache2
Step 5: Find host ip.
sudo hostname -i
127.0.1.1
Step 6: Open web browser and render the html page.
  
http://127.0.1.1/easycodelab.com
Demo Web Page

If you have successfully followed the above steps, you should now be able to launch your first website on the Apache2 web server. This demo page serves as a starting point, and you can expand it to host a complete website using the same methods.