Skip to Content
JavaScriptCSSHTMLPHPReactVueNodeJSMySQLWordPress

Set Up a Website and Apache Virtual Hosts in Ubuntu

Server iconServer

I wasn't much of a Linux guy up until recently. Everything I did was on a Windows machine, whether a personal computer or server because I wanted to do everything in my power to avoid anything involving command-line tools.

Those days are behind me now, and for reasons I can't explain, Linux just makes more sense to me. There's less to manage, less overhead, and, overall, it just works. And I'm into that.

So, with that said (you're extremely convinced now, right?), let's start with the basics and explanation of Apache web servers and how to set them up for your use in the real world.  Then we'll cover installing and setting up Apache with virtual hosts.

Advertising Disclosure: I am compensated for purchases made through affiliate links. Click here for details.

What is Apache?

The Apache HTTP Server, also just called Apache, is a free, open-source HTTP web server developed and maintained by an open community of developers of the Apache Software Foundation.

Apache is used in over 30% of all active websites on the internet today. Each domain or individual website in Apache is called a virtual host, which contains information about each of your websites, directing users to the correct applications within your server.

One of the great things about Apache is that it's cross-platform, meaning it can be installed on a variety of systems. I've worked with Apache on both Linux and Windows at this point and they work great. You can also set up a free Apache web server on a Mac. In this case, we'll be focusing on a Ubuntu server installation.

Let's get started with the installation process.

Step 1: Install Apache

If your Ubuntu server has been set up for a while, it's possible that you already have Apache installed and ready to go. If not, it's quick and easy to get it started. Just use the two following commands to update your server and install Apache:

sudo apt update
sudo apt install apache2

The first line ensures that your Ubuntu server components are all up to date and ensures that your system will grab the latest version of Apache for install. The second line installs Apache.

Step 2: Directory Structure and Permissions

All Apache websites are contained within the /var/www directory of your Ubuntu server. If you're first starting out, you'll probably see an example website installed at /var/www/html. For purposes of this tutorial, let's ignore that and set up our own.

Make sure you're in the correct directory using the following command:

cd /var/www

This command will navigate to the /var/www directory on your server.

Now, let's create a new example directory where we'll store the code for our new Apache website:

mkdir example

Lastly, let's modify the permissions on our new directory to ensure that read access is permitted to all users across the general web:

sudo chmod -R 755 /var/www/example

Then navigate into the new directory for the next step:

cd example

Step 3: Create a Demo Page

Now that our directory structure is built, we need to create an index.html file for Apache to serve. We can do so with the following command:

nano index.html

The nano command launches a text editor within your Ubuntu instance, opening the file if it exists, or creating a new one. Just make sure that you're in the correct directory before creating new files, otherwise, you'll end up creating a new file in the wrong spot and the configuration will fail!

Enter the following sample code for our example HTML page:

<!DOCTYPE html>
<html>
<head>
	<title>My Example Website</title>
</head>
<body>
	<h1>Hello There</h1>
	<p>You have reached my example website.</p>
</body>
</html>

Then save the file. Ctrl+O to save the file, then press Enter to overwrite any old content, if prompted. Ctrl+X to close the text editor.

Step 4: Create a New Virtual Host

You should have an existing Apache virtual host file already installed with your new Apache web server installation. Go to the following directory:

cd /etc/apache2/sites-available

Then open the virtual host configuration file:

nano 000-default.conf

There may be a sample set up in this configuration file already. Let's ignore that and move to the bottom of the file. You can scroll down quickly with Ctrl+PgDn.

Now, let's create an Apache virtual host for our newly created example page. I'll go over each of the items in this configuration in a bit.

<VirtualHost *:80>
	ServerAdmin webmaster@localhost
	ServerName example.com
	ServerAlias www.example.com
	DocumentRoot /var/www/example
	ErrorLog ${APACHE_LOG_DIR}/error.log
	CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Every virtual host entry starts off with a VirtualHost tag. The *:80 next to it directs Apache to serve any and all requests that are made on port 80. If the contents within this VirtualHost tag matches what the user is requesting, that is the content that will be served to them.

Now, let's go over the other directives within this VirtualHost configuration:

  • ServerAdmin: An email address that the website administrator can receive emails through.
  • ServerName: The base domain used to match the virtual host definition. I usually omit www here for clarity.
  • ServerAlias: Other names that can be used to define your base domain. I usually leave the www here so that both www and non-www requests are matched within this single virtual host.
  • DocumentRoot: The directory location on the server containing our website code. In this case, /var/www/example, where we created our index.html file.
  • ErrorLog and CustomLog: The location of the error and custom logs for your domain on the server. {APACHE_LOG_DIR} is the default location defined by your Apache configuration, which is /var/log/apache2 by default.

Step 5: Restart the Apache Server

Now that your virtual host has been set up in your Apache configuration file, we need to restart Apache to pick up the changes:

sudo systemctl restart apache2

If all was successful, you won't see any messages reported in the command line. The command line will just show that it is ready for you to input your next command.

You can also verify the status of your Apache web server and view any errors if the restart was unsuccessful:

sudo systemctl status apache2

If all went well, you should now be able to browse to your new example website from any location your Ubuntu server is accessible from.

Any time an Apache web server configuration update is made, you will need to restart Apache to enable the new changes. This will result in a short downtime of every website managed within your Apache configuration until Apache has restarted successfully, so try to restart sparingly.

Step 6: DNS Setup

To explain this step in summary, you'll need to make sure your DNS settings are updated properly through your domain registrar, the service you registered your domain through. Popular registrars include GoDaddy, Amazon Web Services, and more.

If you don't know who your domain registrar is, you can also run a whois query and type in your domain name to find the information you need.

When updating your DNS information, just change the A record to point to your server's public IP address and allow a few moments for the changes to propagate to the web.

DNS propagation speeds have improved over the years, but many will still tell you it can take 72 hours for your changes to fully propagate across the web. Submit your changes, then check back in a few minutes. You can also verify a website's current IP address by doing a DNS lookup.

Conclusion

Apache website management on a Ubuntu server running Apache is a pretty straightforward process. It's like riding a bike. Once you do it a few times, it'll be second nature.

You can expand on what we talked about above to create multiple virtual hosts within the same Apache configuration file by setting up multiple VirtualHost nodes and using different values for your domain directives.

Now that search engines strongly recommend (pretty much require) using the HTTPS protocol for any website, continue reading on to configure virtual hosts with SSL.

Posted by: Josh Rowe
Last Updated: October 07, 2020
Created: August 29, 2020

Comments

There are no comments yet. Start the conversation!

Add A Comment

Comment Etiquette: Wrap code in a <code> and </code>. Please keep comments on-topic, do not post spam, keep the conversation constructive, and be nice to each other.