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!