Building a website used to be a laborious and expensive endeavor in the past. Registering a domain, arranging hosting, and setting up DNS were often done through different companies, making it difficult and time-consuming to build a website from scratch. Fortunately, those days are over, as companies like Amazon now offer comprehensive functionality when it comes to building and maintaining a website.
Introduction
Amazon offers a comprehensive set of tools for website administration. In fact, most of these tools are available under Amazon’s 12-month free tier, which means you can start a website from scratch with no money up front. All you’ll have to pay for is a separate domain.
In this article, we’ll cover the following aspects of building a website:
- Hosting website assets with Amazon S3 (free);
- Reduce latency and increase transfer speeds by leveraging AWS CloudFront (free);
- Register a domain and redirect it to CloudFront (additional fee for domain ).
And with that, we go straight to the first section.
How to Host a Website on Amazon S3
First things first First, we need to organize the hosting of our website assets (all HTML files, images, etc.). For this purpose, Amazon offers its cloud object storage: Amazon S3. To get started with S3, you must first sign in to the AWS web console. If you’re having trouble signing up for the AWS console, see our article that explains the process in detail.
Once you’ve signed up for the console, open the console and search for S3, Amazon’s object storage. solution.
Now click Create Bucket.
Enter the repository name, specify the region, and click Next.
In the next step, you can enable version control , server access logging, tagging, object-level logging, and default encryption. We don’t need that for now, so skip these options and click Next.
In the next step, you can specify the necessary permissions. It is important that you select Grant public read access to this repository in the public permissions dropdown menu. Otherwise, it will be impossible to access the website contents located in this bucket.
Review the bucket properties and permissions and click Create Bucket.
Now locate your repository in the list of repositories and click on it.
Click Upload and upload the resources. In our case, we’ll simply add an HTML file and an image to host a simple static page.
Well, that was pretty easy! Our hosting is now ready and we can access the assets from anywhere. Just click on the HTML file and try to open the link. You should see the web page you uploaded to the bucket. If you only want to use AWS for hosting and want to get the domain somewhere else, that’s it! Register your domain with a different company and point it to the link shown in the screenshot below.
Now that we’ve covered hosting, let’s move on to network optimization with CloudFront.
Leveraging Amazon CloudFront
Amazon CloudFront is a global content delivery network (CDN) service that securely delivers data to its users with low latency and high transfer speeds. CloudFront delivers your content through a worldwide network of data centers called edge locations. When a user requests content that you are serving with CloudFront, the user is directed to the edge location that provides the lowest latency (time delay), so that the content is delivered with the best possible performance.
Search for CloudFront in the AWS console search bar. Open it.
Here’s a console that takes care of everything related to CloudFront. We won’t cover every aspect of the console so as not to overcomplicate this post. It’s best if you refer Amazon documentation> for more information on this.
In summary, at this point, you should create a CloudFront distribution to ensure that your website assets are accessible from anywhere quickly. Create Distribution.
Click Get Started under Web.
The next step is one of the most complicated. Here, you need to specify the source configuration of the distribution, l a default cache behavior configuration and the general distribution set. stuff. This lengthy Amazon article provides a detailed description of each option. We would like to point out some essential options that you should configure:
Source domain name. This is the source repository that contains all the data. Once you start typing the bucket name, Amazon will automatically suggest the correct choice.
Alternative Domain Names (CNAMEs). If you want to use subdomains to access your website, as we are going to do, specify them. Let’s enter test.cloudberrylab.io.
Default root object. By default, if you try to open the website address, you will encounter an error because test.cloudberrylab.io is not an HTML page, while test.cloudberrylab.io/index.html is. At this point, asking users to specify the index page is outdated. To enter the page name, users will be automatically redirected
from test.cloudberrylab.io to test.cloudberrylab.io/index.html. Do not type “/index. html”: Simply enter “index.html” without a forward slash.
IPv6. It’s easier if you disable IPv6 for now. If enabled, you’ll need to create two alias records when redirecting your domain to CloudFront. You can do it later; for now, just disable it. 1024×565.png” alt=”enable IPv6″ />
When done, click Create Distribution. Once created, click on it and the console will display the overview The Domain Name is your CloudFront address. When accessing website content using this link, users will receive data from the fastest location. Copy and paste it into the browser’s address field and press Enter.You should see your page!
It is important that your HTML files reference images using the CloudFront addresses to ensure images load quickly.Each resource is available at the following address:
CloudFront domain name + the path of the resource in the S3 bucket.
This is what it looks like inside our Sample HTML file:
And here is our page:
All assets are stored in S3 and reached through CloudFront for best performance.
With the AWS Free Tier, you get 50 GB of data transfer and 2,000,000 Amazon CloudFront HTTP and HTTPS requests at no charge for 12 months.
We’re almost done here. In the last section, we’ll explain how to register a domain and redirect it to the CloudFront domain name using AWS Route 53. Naturally, this comes at an additional cost. So, if you were just looking for free solutions, you can close the article now and enjoy your website!
Registering a domain using AWS Route 53
You can use Amazon Route 53 to help you put launching a website or web application Route 53 r performs three main functions:
- Register domain names
- Route Internet traffic to resources on your domain
- Check the status of your resources .
Go to the AWS Route 53 service.
Under Registered Domains , click Register Domain.
Follow the three steps (they are pretty easy to navigate).
When you’re done, go to Hosted Zones and click your domain.
Now you need to create an rrecordset that will route Internet Traffic to your CloudFront distribution.Click Create Record Set.
Now, specify the following parameters:
- Name. Enter the domain name you want to use to route traffic to your CloudFront distribution.In this example, we will type test;
- Type.Select A – IPv4 Address;
- Aliases Select Yes;
- Target of alias.Enter the domain name of your C distribution loudFront;
- Routing policy. Leave the default of Simple;
- Assess target health . Select No.
Click Create.
It might take a couple of minutes for your traffic to be routed to your CloudFront distribution. If you did everything correctly, your content should be available on the specified domain.
Conclusion
Building and maintaining a website with AWS is really a very easy task. Amazon’s well-integrated ecosystem allows you to effortlessly register a domain, host your website, and ensure fast load times with the help of CloudFront.
If you’re serious about AWS services and want to do it all Make sure to regularly back up your S3 data in case of a server failure or problem. Options you might consider for backing up your S3 data include: Google Cloud, Microsoft Azure, or even your local NAS storage. MSP360 Backup can help you do it conveniently in just a few steps.
.