How to Setup a Static Website on a CentOS 7 Virtual Machine

Amarachi Iheanacho - Sep 25 '22 - - Dev Community

As defined by Wikipedia, a virtual machine is the virtualization of a computer system. Virtual machines have their CPU, memory, and operating system and can act independently of the host.

Virtual machines are especially useful in this age of large multi-user applications that require continuous updates from various teams across various departments. Virtual machines help mitigate complications due to the difference in the host machine's hardware specifications.

Prerequisites

To get started with this article, we must have the following:

  • Virtualization Technology (VT) enabled in BIOS. To understand how to enable VT, check out this article
  • A Command line interface (CLI) installed on the computer. For Windows users, it is advisable to use GIT Bash to run the vagrant commands. To download GIT Bash, check out this page
  • A virtualization product like VirtualBox, install VirtualBox from here
  • A code editor

Creating a Centos7 virtual machine

To create our virtual machine, we run this terminal command to create a directory that will house our project.



    mkdir <name of our project>


Enter fullscreen mode Exit fullscreen mode

Next, we change the current directory to our newly created directory.



    cd <name of our project>


Enter fullscreen mode Exit fullscreen mode

After creating our project directory, we create a directory that will hold our website template.



    mkdir <name of our website>


Enter fullscreen mode Exit fullscreen mode

We then change our current directory to our website directory.



    cd <name of our website>


Enter fullscreen mode Exit fullscreen mode

Creating virtual machines using vagrant box
Vagrant boxes are packaged ready-made vagrant environments that can be downloaded and used to create virtual machines. We discover vagrant boxes from the Vagrant cloud.

In this article, we will use the geerlingguy/centos7 virtual box.

CentOS 7 Vagrant box

This terminal command creates a vagrant file with the 'geerlingguy/centos7' virtual box.



    vagrant init geerlingguy/centos7


Enter fullscreen mode Exit fullscreen mode

We should see this in our terminal.

Vagrant box download Output

Next, we go to the newly created Vagrantfile file on our laptop and open it up with any available code editor.

CentOS 7 Vagrantfile

The Vagrantfile contains this information.

Vagrantfile information

Next, we uncomment the following lines:

  • line 35 : The config.vm.network "private_network", ip: "192.168.33.10" line contains the IP address that we use to access our website
  • line 40: The config.vm.network "public_network" line gives us a dynamic IP address
  • line 52, line 57, line 58: These lines give our virtual machine more RAM as the default CentOS 7 RAM is 512MB.

Here is how our Vagrantfile looks:
Vagrantfile
Vagrantfile

Next, we save the Vagrantfile and start the virtual machine. Start up the virtual machine with this terminal command.



    vagrant up


Enter fullscreen mode Exit fullscreen mode

Start up a virtual machine output

We then log in to the virtual machine.



    vagrant ssh


Enter fullscreen mode Exit fullscreen mode

Login to a Virtual Machine

Next, we change to the root user.



    sudo -i


Enter fullscreen mode Exit fullscreen mode

Root User

Next, we install the httpd, wget, and unzip packages with this command.



    yum install httpd wget unzip -y


Enter fullscreen mode Exit fullscreen mode

These packages do the following:

  • httpd: The httpd package plays the role of a server in our application
  • wget: The wget package will download the website template
  • unzip : The unzip package will unzip the downloaded template

After installing our packages, we start our server and enable it so that the server will come up when the virtual machine boots up.



    systemctl start httpd 
    systemctl enable httpd


Enter fullscreen mode Exit fullscreen mode

Restarting the httpd server

To access our website IP address, we run this terminal command.



    ip addr


Enter fullscreen mode Exit fullscreen mode

Access our IP address

Next, we copy the 'inet' IP address and paste it into our browser to see the default page.

IP address

Use the 'inet' IP address in the "3:" section. In the picture above, we use 192.168.33.10.

We should see this page in our browser.

Apache Default Page

Getting the website template
In this section of the tutorial, we are going to get the download link to a website template and download the template in our project.

To get the download link, follow these steps:

  • Go to the tooplate website and choose a template
    Tooplate Website template

  • Click ctrl shift i to open up the chrome console
    Google Chrome Console

  • Navigate to the Network tab and click the download button on the template page.
    Chrome Network Console

  • In the Network tab, click on the zip file, and copy the Request URL. This Request URL is the download link to the website template
    Chrome Network Console

Downloading the website template in our project
We change the current directory to the /tmp/ directory in our project.



    cd /tmp/


Enter fullscreen mode Exit fullscreen mode

The /tmp/ directory is a temporary landing place for files, and it will be responsible for holding our website template in the meantime.

To download the website template, run this terminal command.



    wget <link to the website template we copied>


Enter fullscreen mode Exit fullscreen mode

Downloading Website Template

To verify that we have successfully downloaded the website template, run this terminal command.



    ls


Enter fullscreen mode Exit fullscreen mode

We then unzip this file with this command.



    unzip <name of the zip file>


Enter fullscreen mode Exit fullscreen mode

Unzip Website Template

To see our unzipped file, run this command.



    ls


Enter fullscreen mode Exit fullscreen mode

Unzipped files

To see all the files and directories in our unzipped file, we change the directory to our unzipped file and run the ls command.



    cd <name of your unzipped website template>
    ls


Enter fullscreen mode Exit fullscreen mode

List of files in the unzipped template folder

Hosting the website in our virtual machine
We store the HTML files we see when we navigate to our inet IP address in the /var/www/html directory. In the /var/www/html directory, the first file the server renders by default is the index.html.

To see our website in the browser, we copy the files in the unzipped template to our /var/www/html directory. Run this command to copy each file and directory to the /var/www/html directory.



    cp -r * /var/www/html


Enter fullscreen mode Exit fullscreen mode

To verify that we successfully copied the files and directories, change the current directory to /var/www/html and run the ls command.



    cd /var/www/html
    ls


Enter fullscreen mode Exit fullscreen mode

The html directory

Next, we restart our server to see the changes in our browser.

Website in our CentOS 7

Conclusion

This article discussed downloading and hosting a website template on a CentOS 7 virtual machine.

Resources

The following resources may be helpful:

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .