Host a static website on AWS EC2

Host a static website on AWS EC2

As you have already noticed that Cloud computing is powerful and expansive and will continue to grow in the future and provide many benefits. Cloud computing is extremely cost-effective and companies can use it for their growth. The future of cloud computing is bright and will provide benefits to both the host and the customer.

I decided to post some useful stuff that might help you in getting started.

You all might have created simple websites and deployed it locally in your PC or laptop which you are only capable of accessing it.

But, how about Deploying it in cloud where everyone can access it ?

🤔 Wait in Cloud.......
"Yes you heard it right"

Amazon Elastic Compute Cloud (Amazon EC2) is a web service that provides resizable compute capacity in the cloud. It is designed to make web-scale cloud computing easier for developers. In layman terms imagine it as another computer in some location where we have it's remote access.

Well I get it but why Amazon EC2 ?

As you know how much it costs to setup and maintain a server. And for a startup or an individual it's more important to focus on business strategy rather than focusing on the infrastructure. This is where AWS comes into play. Amazon EC2 changes the economics of computing by allowing you to pay only for capacity that you actually use. Amazon EC2 provides developers the tools to build failure resilient applications and isolate themselves from common failure scenarios.

So enough of the briefings and let's focus on the topic 🕵️♀️

And here we go 👉

10 Steps to Deploy

Step-1: Choose AMI (Amazon Machine Image)

So as I said we will be deploying our website on a virtual computer therefore we will be setting up our virtual computer/server. Now since the hardware for virtual server is provided by Amazon, our task here is to select the operating system for our server. AMI in layman terms is an image of a operating system similar to ISOs available for Windows and Linux that we download and install on our PCs.

(Prerequisite: AWS account free tier or AWS Educate anything will do)

Now follow the steps to set it up:

  • In the AWS Management Console on the Services menu, click EC2
  • At the top right of the screen, if you see New EC2 Experience toggle to use the new UI, if it is not enabled by default.
  • Click Launch instance > Launch instance.
  • Click Select next to Amazon Linux 2 AMI 

No alt text provided for this image

Step-2: Choose an Instance Type

 Amazon EC2 provides a wide selection of instance types optimized to fit different use cases. Instance types comprise varying combinations of CPU, memory, storage, and networking capacity and give you the flexibility to choose the appropriate mix of resources for your applications.

Select t2.micro

No alt text provided for this image

Step 3: Configure Instance Details

This page is used to configure the instance to suit your requirements. This includes networking and monitoring settings. For now we will go with the default setting so click on Next: Add Storage.

Step 4: Add Storage

Amazon EC2 stores data on a network-attached virtual disk called Elastic Block Store.

You will launch the Amazon EC2 instance using a default 8 GiB disk volume. This will be your root volume (also known as a 'boot' volume).

No alt text provided for this image

Now click on Next: Add Tags

Step 5: Add Tags

Now click on add tag and set the name according to your wish.

No alt text provided for this image

Click on Next: Configure Security Group

Step 6: Configure Security Group and Launch the instance (Important part)

Click on Add Rule and from the dropdown select HTTP and HTTPs.

No alt text provided for this image

Now Click Review and Launch > Launch

You will be greeted with the following screen 👇🏻

No alt text provided for this image

Click on "Create a new pair" and give a name say "linuxkey" to it.

Now click "Download Key Pair" and note the folder where it gets downloaded as we will need it later.

Scroll down and select "Launch"

Navigate to instances and wait for a few minutes for the instance to spin-up.

No alt text provided for this image

You will see something like this if everything is configured correctly 👆🏻

Step 7: Connecting to the Instance

Now that your instance is up and running the time has come to connect.

We have several different ways to connect to an instance using putty, powershell, and even directly through the Amazon Console. But here I have used the powershell method as it's convenient for me.

  • Launch Powershell and navigate to the folder where you have downloaded the "linuxkey.pem" file.
  • Type the following command (note: your key file and instance name might be different)

Basic Structure is: "ssh -i <name of key file><space><Public ipv4 DN>

ssh -i "linuxkey.pem" ec2-user@ec2-3-138-244-212.us-east-2.compute.amazonaws.com        

Once you have successfully connected you will get something like this 👇🏻

No alt text provided for this image

Now that you have connected to the instance let's move on to the next step.

Step 8: Installing the Web Server

  • First elevate your privileges

sudo su        

  • Update all of the packages on the instance

yum update -y        

(note: if you are familiar with using homebrew on your Mac, you can think of the way we are using yum here as similar to brew)

  • Installing the apache webserver

yum install httpd -y        

  • Starting the webserver

service httpd start        


Step 9: Check if the server is working

Now go to the amazon console and navigate to instance. Click on the the instance that you had just set up. Below you will see the public ipv4 address of the instance.

No alt text provided for this image

Copy the Public IPv4 address and paste it in another tab of your browser.

If you see this page then ✨🎇Congratulations🥳🎉 you are successful in setting up your server.

No alt text provided for this image

Now let's get back to the powershell.

Step 10: Add a static HTML file to be served

The time has come to add our own custom web page.

By default, the apache web server will display the index.html file found in /var/www/html directory in the root path of your website.

In this section you will create an index.html file to be served.

  • Navigate to the directory mentioned above

cd /var/www/html         

  • Create an index.html file in this directory

nano index.html        

Nano is a simple, modeless, WYSIWYG command-line text editor included in most Linux installations. With a simple easy to use interface, it is a great choice for Linux beginners.

  • Add any html content to the file 

For me I'm choosing the Bootstrap starter template you can choose anything you like.

<html><body>My webserver is running!!!😮</body></html>        

Now once you have written the code press ctrl+x and then press "y" for confirmation and press Enter to save and exit.

Test your website

Follow that steps that we did while we were testing the apache server. Copy the IPv4 address and paste it in the browser.

No alt text provided for this image

If you see your website rendering then Voila! you now have a website deployed on Cloud.

Note: You can share this IP with your friends and they will be able to access it. To take it further you can configure a domain name like "www.mywebsite.com" with your IP where your friends will not have to remember the complex IP address.

"Congratulations for making it till the end."
"The Infrastructure is all set now it's on you how to expand it."

I hope this guide has been helpful to all of you. 🙏🏻

Much love,

CM💻^_^













Actually i have done the same process but at the end i only see a web page with a text written it works and my html file has not been read

Like
Reply

That was a great explanation...!!! How to edit that file again and how to deploy lots of html pages manually ?

Like
Reply

Great explanation and depiction of requirement of cloud.

To view or add a comment, sign in

Others also viewed

Explore content categories