How to Launch a Website on AWS for Free in 15 Minutes

Are you looking to create a website but feeling intimidated by the cost and complexity of web hosting? Amazon Web Services (AWS) is a great solution. While AWS is known for powering some of the world‘s biggest websites and applications, it‘s also an excellent option for hosting simple static sites for free.

In this step-by-step guide, I‘ll show you how to get a basic website up and running on AWS in just 15 minutes without spending a dime. As a full-stack developer who uses AWS regularly, I‘ll walk you through the process in a clear, beginner-friendly way.

By the end, you‘ll have a functional website hosted on AWS that you can share with the world. Let‘s get started!

What You‘ll Need

Before we dive in, make sure you have the following:

  1. An AWS account (sign up for the free tier at aws.amazon.com)
  2. The HTML and CSS files for a basic static website (you can use a simple "Hello World" page to start)
  3. A code editor for making changes to your website files
  4. A modern web browser like Chrome or Firefox

Got everything? Great, let‘s move on to the first step.

Step 1: Create an S3 Bucket

The core AWS service we‘ll be using is Simple Storage Service, or S3 for short. S3 allows you to store and retrieve data, but it can also host static websites, which is what we‘ll take advantage of.

To get started, log in to your AWS Management Console and navigate to the S3 page. Click the "Create bucket" button.

S3 stores data in "buckets", which are essentially containers for files. Choose a unique name for your bucket (e.g. "my-cool-website"). Then select the AWS Region closest to the majority of your website visitors.

Create S3 bucket screenshot

Under "Block Public Access settings", uncheck the "Block all public access" box. Acknowledge the warning that appears. This will allow your bucket to be accessed publicly via the internet, which is necessary for hosting a website.

Unblock public access screenshot

Leave the other settings at their defaults and click "Create bucket" at the bottom of the page. Your bucket is now ready to go!

Step 2: Enable Static Website Hosting

By default, S3 buckets are configured for general storage. We need to enable a special setting that turns the bucket into a static website host.

Open your newly created bucket and go to the "Properties" tab. Scroll down and click on "Static website hosting".

Enable static website hosting screenshot

Select "Use this bucket to host a website". Enter "index.html" for the Index document (this is the homepage of your site). You can also specify an Error document that will be shown if an error occurs.

Click "Save" to apply the settings. Your bucket is now configured to serve your website files to visitors.

Step 3: Upload Your Website Files

Now it‘s time to upload your actual website files (the HTML, CSS, images, etc.) to the S3 bucket.

Open your bucket and click "Upload". Add your files (e.g. index.html, style.css) and folders. Be sure to specify "index.html" as the homepage.

Upload files screenshot

Once the files are done uploading, your website is almost ready to go. There‘s just one more step.

Step 4: Adjust the Bucket Policy

By default, the files in a S3 bucket are not publicly accessible, even if the bucket itself is. We need to add a bucket policy that grants read permissions to everyone.

In your bucket, go to the "Permissions" tab and click "Edit" under "Bucket policy". Paste in the following policy, replacing "my-cool-website" with the actual name of your bucket:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::my-cool-website/*"
        }
    ]
}

Edit bucket policy screenshot

This JSON-based policy gives everyone on the internet permission to view the files in your bucket. Save the changes.

Step 5: Access Your Website

Congratulations, your website is now live on AWS! To view it, go back to the "Properties" tab in your bucket and click the URL under "Static website hosting".

Static website URL screenshot

You should see your website appear. It will be hosted at a domain that looks like http://my-cool-website.s3-website.us-east-2.amazonaws.com. Feel free to share that URL with others so they can access your shiny new site.

Bonus: Use a Custom Domain

While the default AWS URL works fine, you might want to use a custom domain for a more professional look. Luckily this is easy to set up using Amazon Route 53, AWS‘s domain management service.

First, purchase a domain through Route 53 or transfer an existing one. Then, create a "Hosted Zone" for the domain in Route 53.

Next, go to your S3 bucket and update the static website hosting settings. Enter your custom domain (e.g. www.mysite.com) in the "Endpoint" field.

Configure custom domain screenshot

Under "Permissions", edit the bucket policy to allow access to your custom domain:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::my-cool-website/*"
        },
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow", 
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::www.mysite.com/*"
        }
    ]
}

Finally, in Route 53, create an "A record" that points to your S3 bucket‘s static website hosting endpoint. This tells browsers where to find your site when someone visits your domain.

Configure A record screenshot

Give it a few minutes to update and your website will be accessible at your custom domain. As a bonus, you can even use AWS Certificate Manager to add a free SSL certificate for HTTPS.

Next Steps

Congratulations, you now have a fully functional static website hosted on AWS for the excellent price of $0!

Of course, a static site is just the beginning of what you can build on AWS. As you scale up, you might want to add dynamic capabilities like a backend API or database. Some other key services to check out:

  • Elastic Compute Cloud (EC2): Virtual servers for running applications
  • Relational Database Service (RDS): Managed SQL databases like MySQL and PostgreSQL
  • DynamoDB: A fast and flexible NoSQL database
  • Lambda: Run backend code without managing servers
  • CloudFront: A content delivery network (CDN) for improved performance

I hope this guide has shown you that getting started with AWS doesn‘t have to be overwhelming or expensive. Feel free to use this project as a jumping-off point to explore the incredible variety of tools AWS offers for building powerful, scalable web applications.

Happy coding!

Similar Posts