Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the wordpress-seo domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /home/u740810125/domains/quadrect.com/public_html/blogs/wp-includes/functions.php on line 6114

Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the bunyad domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /home/u740810125/domains/quadrect.com/public_html/blogs/wp-includes/functions.php on line 6114
How to Host a Static Website with AWS EC2 and Nginx: A Step-by-Step Guide - Quadrect Blogs

Introduction

In today’s digital age, having an online presence is crucial for sharing information, showcasing portfolios, or running a business. One efficient way to establish such a presence is through a static website, which offers reliability, speed, and reduced complexity. This tutorial will guide you through setting up a static website on Amazon Web Services (AWS) using Elastic Compute Cloud (EC2) and Nginx, a powerful, high-performance web server.

Prerequisites

Before you begin, ensure you have the following:

  • An AWS account.
  • AWS CLI installed and configured on your machine. Install AWS CLI
  • Basic knowledge of terminal or command line usage.
  • An SSH client installed, if not already available in your system.

Step 1: Generate a Key Pair

First, create a key pair for secure SSH access to your EC2 instance. Open your terminal and run the following command:

aws ec2 create-key-pair --key-name quadrect-key-pair --query 'KeyMaterial' --output text > quadrect-key-pair.pem

This command generates a new key named quadrect-key-pair and saves it in your current directory. Secure the key file by setting the correct permissions:

chmod 400 quadrect-key-pair.pem

Step 2: Launch an EC2 Instance

Log in to the AWS Management Console, navigate to the EC2 dashboard, and click “Launch Instances”. Select the Amazon Linux AMI, which is free under the free tier. Ensure that your instance is associated with the quadrect-key-pair you created earlier.

Step 3: Configure Security Groups

Edit the security group associated with your EC2 instance to allow inbound traffic on port 80 (HTTP) and port 22 (SSH). This setting will enable visitors to access your website and allow you to connect to the instance remotely.

Step 4: Connect to Your Instance

Use SSH to connect to your EC2 instance from your terminal:

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

Replace ec2-instance-public-ip with the actual public IP address of your EC2 instance.

Step 5: Install and Configure Nginx

After accessing your instance, install Nginx:

sudo yum install nginx -y
sudo systemctl start nginx
sudo systemctl enable nginx

Verify that Nginx is running:

systemctl status nginx

Step 6: Deploy Your Static Website

Navigate to the Nginx HTML directory. Here, you’ll replace the default index.html with your custom page:

cd /usr/share/nginx/html
sudo nano index.html

Insert the following HTML as a starter template:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to Quadrect!</title>
</head>
<body>
<h1>Hello, World!</h1>
<p>Welcome to our static website hosted on AWS EC2 with Nginx. This site demonstrates a simple, scalable approach to web hosting.</p>
</body>
</html>

Save and close the file. Your website is now live and can be accessed by navigating to http://ec2-instance-public-ip.

Conclusion

Congratulations! You have successfully set up a static website on AWS EC2 with Nginx. This setup provides a scalable, secure, and cost-effective solution for hosting static content. As you grow more comfortable with AWS and Nginx, consider exploring more advanced configurations and capabilities to enhance your site.

Cleanup

Remember to terminate your EC2 instance if it is no longer needed, to avoid ongoing charges:

aws ec2 terminate-instances --instance-ids instance-id

Replace instance-id with your actual EC2 instance ID.

For more detailed guides and tips on web development and cloud services, keep visiting Quadrect.com!

Share.
Leave A Reply