Static Website Deployment on AWS EC2

Static Website Deployment on AWS EC2

ยท

3 min read

In today's dynamic tech landscape, the deployment of static websites stands as a cornerstone skill for navigating the digital realm. With an emphasis on Amazon EC2 instances and the Apache HTTP Server (httpd) on AWS Linux, this project offers a comprehensive guide to deploying static websites.

Prerequisites

  • An AWS account

  • Basic understanding of AWS services

  • Familiarity with Linux commands

Step 1: Launching an EC2 Instance

  1. Sign in to your AWS Management Console.

  2. Navigate to the EC2 dashboard.

  3. Click on "Launch Instance" and select an Amazon Linux AMI.

  4. Choose an instance type and configure instance details.

  5. selecting an existing key pair or creating a new one.

  6. Review and launch the instance,

Note: I have a static website for an E-commerce bookstore web application that I used for deployment. If you have any other projects, feel free to use those instead.

Step 2: Connecting to the EC2 Instance

  1. Once the instance is running, note its public IP address.

  2. Open a terminal or SSH client.

  3. Use SSH to connect to the instance:

     ssh -i your-key.pem ec2-user@your-instance-public-ip
    

    Replace your-key.pem with the path to your private key file and your-instance-public-ip with the public IP of your EC2 instance.

Step 3: Setting Up the Web Server

  1. Switch to the root user:

     sudo su -
    
  2. Update the package repository and install the Apache HTTP Server:

     yum update -y
     yum install -y httpd
    

    After executing the commands, the setup resembles the image below.

  3. Create a directory to organize your website content. You can name it according to your preference, such as mkdir <directory name>, or if you prefer to proceed without creating a directory, you can continue as well:

     mkdir digilib
     cd digilib
    
  4. To obtain your website files, you have the option to either download a zip file hosted on GitHub or utilize your own web project files. If opting for GitHub, navigate to the repository, click on the "Code" dropdown menu, select "Download ZIP," and copy the provided link. Then, right-click on the "Download ZIP" button and select the "Copy link address" option. Finally, use the copied link with the

    wget <your repository link> command to retrieve the files, as outlined below.

     wget https://github.com/HemanthGangula/Static-Website-AWS-EC2-Apache/archive/refs/heads/main.zip
    

    After executing the command, use the 'ls' command to list the contents. You should observe a file named 'main.zip'.

    Unzip the downloaded zip file:

      unzip main.zip
    

  5. Move the contents of the unzipped folder to the Apache document root directory:

     mv * /var/www/html
    
  6. Navigate to the document root directory:

     cd /var/www/html
    

Step 4: Configuring the Web Server

  1. Ensure that inbound rules for your EC2 instance's security group allow traffic on ports 80 and 443.

  2. Check the status of the Apache service:

     systemctl status httpd
    
  3. Enable the Apache service to start on boot:

     systemctl enable httpd
    
  4. Start the Apache service:

     systemctl start httpd
    

Step 5: Verifying Deployment

  1. Open a web browser and enter your EC2 instance's public IP address.

  2. You should see your static website up and running.

In my case, the output of the website appears as follows after hosting.

Thanks to Meghana, the website has been contributed.

You can view my website at the following link: http://34.201.122.99/

In my case, I didn't add a custom domain for the website. However, if you need to do so, I can provide simple steps to guide you through the process in the next article.

Congratulations! You have successfully deployed a static website on an AWS EC2 instance using the Apache HTTP Server. You can now access your website from anywhere with an internet connection. Keep exploring AWS services to enhance your website's capabilities and performance.

Did you find this article valuable?

Support Hemanth by becoming a sponsor. Any amount is appreciated!

ย