DEV Community

Tikam Singh Alma
Tikam Singh Alma

Posted on

Deploying Static Website in Apache2.4

#cloud #productivity #devops #tutorial

Creating a Static Website and Getting Working Directory Path

A Static website is a simple content website that runs without a server, just processing the contents added on the website, generally created using HTML, CSS, and JavaScript.

For quickly deploying we will just add a simple index.html HTML file and configure it in the virtual host configuration.
We will change the default index.html page of the apache webserver to add

Open the terminal change directory to /var/www/html/
remove the index.html and create a new index.html file.

Remove the existing index.html

$ cd /var/www/html
$ rm -r index.html
Enter fullscreen mode Exit fullscreen mode

Create a new index.html and edit it

$ nano index.html
Or 
$ touch index.html

Start VIM 
$ vi index.html
Enter fullscreen mode Exit fullscreen mode

Content of index.html

<!DOCTYPE html>
<html>
    <head>
        <title>My First Website</title>
    </head>
    <body>
        <p>Hello World!My First Site Deployed On Apache2.4 Webserver</p>
    </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Configuring virtualhost

Open the directory /etc/apache2/

**Open the website configurations inside /etc/apache2/sites-available, if setup custom website - /sites-available/my-site.conf

Or open the default configuration under
/etc/apache2/sites-available/000-default.conf
and update the ServerName to whatever domain you want or for testing it locally change it to localhost

change the Root Directory of the contents
here our root directory where our contents are stored is /var/www/html/
Update it to
DocumentRoot /var/www/html

Final Configuration will look like this

<VirtualHost *:80>
        ServerName localhost

        ServerAdmin webmaster@localhost
        DocumentRoot /var/www/html

        #LogLevel info ssl:warn

        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined

</VirtualHost>
Enter fullscreen mode Exit fullscreen mode

Testing and deploying a static website

After adding configurations to VirualHost, check the configurations for any warning or error using this command.

sudo apachectl configtest
Enter fullscreen mode Exit fullscreen mode

Reload and Restart the server

# Reload
$ sudo service apache2 reload

# Restart
$ sudo service apache2 restart
Enter fullscreen mode Exit fullscreen mode

**Test the live server with updated content using Curl in terminal or opening the localhost in your local system.

$ curl localhost:80
Enter fullscreen mode Exit fullscreen mode

Top comments (0)

Read next

zmsoft profile image

Behind the Code: Unveiling the Dark Side of App Development

zmsoft -

amaraiheanacho profile image

How to automate email sending from MySQL databases using Boomi

Amarachi Iheanacho -

justinepdevasia profile image

Docker Log Observability: Analyzing Container Logs in HashiCorp Nomad with Vector, Loki, and Grafana

justinepdevasia -

thelamina profile image

How to Implement Face Detection in React Native Using React Native Vision Camera

Itunu Lamina -