Host Your Custom Domain Name with Amazon Route 53 and Google Firebase
In this article I will walk you through how to set up a domain name and host your website using Amazon Web Services Route 53 and Google Firebase.
I assume that you should know what a domain name is and the advantages of owning one. If you do not, or you don’t know a tiny internet thing, no worry, this article is also for you. I will provide the simplest way to set it up by using reliable services from Google and Amazon. You can jump to the Get Started part if you are good to skip some introductions :).
What is a Domain Name and Why need to get one?
To simply put, a domain name is a unique web url address. You can use this domain name to do things that show professionalism, including:
- A website with url includes your name or your brand name (e.g. johnnash.me, mystartupname.com etc.)
- Your email address too! Instead of being another “gmail.com” or “hotmail.com”
You need to have your domain name asap if you wish to go a long way with your identity such as hosting a personal website or a company website or your portfolio. Claim it now or never because once your desired name is picked up by others, you have to think of another unique domain name to use!
There are many supportive reasons you can find online.
Before getting started, one thing to note that you probably have to pay for your desired domain name inevitably. No pay no gain right? So let's get started.
Get Started
Step 1: Buy a domain name from Amazon Route 53
We are going to buy a domain name from Amazon Route 53 in Amazon Web Services (AWS). Another option I would suggest is Google Domains if it is available in your country (still a beta version as of July 2018). I personally prefer these two big names. You can also buy it from other providers.
Please proceed to register a AWS account if you do not have one and set up payment methods.
Then we can navigate to the Route 53 Management Console after login. You should be able to find below Register domain in the page.
Type in your desired domain name to check the price. Common suffix would be .com, .co, .io and .me etc. Be sure you checked carefully with the domain price and undersrand how you can be charged in Amazon Route 53 Pricing. Add to cart and continue, then finish your purchase.
Then you should receive a email stating that your domain was successfully registered with Route 53 after some time. You own it after you have purchased it, but you still have to wait the domain become effective.
Also get familiar with the portal and navigate to Hosted Zones. You will have to make some configurations later on.
Step 2: Host a Website With Google Firebase Hosting
Firebase is a platform consists of a lot of tools to help mobile platform development. Firebase Hosting is one of the tools that we can benefit from. It is used for hosting website and it is completely free to use. You can refer to their introduction. It can host complicated website but we are going to deploy a very simple one page website to the domain.
There are some benefits shown in their Firebase Hosting introduction video. One huge benefit is Firebase Hosting provides free SSL certificate to host your website with your domain.
It really makes you becoming a Pro if your website url address starts with https. It is cruial when data security is always a critical topic. You don’t want people visiting your site and feeling unsafe. And the best part is they configure automatically for you in which normally you have to pay for the SSL cert!
To sum up the advantages:
- Free hosting, ranging from simple to complex websites
- Website cached at CDN servers equals fast response to any region
- Free SSL certificate provided and automatically configurated
You just need to provide the domain name just bought. How great is that!
So proceed to register an account and navigate to the console. Add and create a project.
Find Hosting in the left panel and click Get started to set up hosting.
Just follow the installation guide from firebase. You will be guided to deploy a simple page provided by firebase.
You firebase hosting url will be https://your-project-id.firebaseapp.com. After you have successfully deploy, you will see the below page showing success.
Then you now own a url address that will serve content in the internet! Every time you hit the command firebase deploy.
It will serve your html file to the url address in the public folder of your project directory. Try to change the index.html to other index.html or modify the file and deploy it to see the updated website.
Congratulations 🎉🎉! You have successfully deploy the website with your own content!
So now you have control to show content on the url address! But the url address is not looking nice. Now we can use the domain name bought from Amazon Web Service Route 53.
Step 3: Link Your Domain to Google Firebase Hosting
Click Connect Domain. Enter the domain name you bought and continue.
As instructed, you need to add TXT record to the domain name back to your Amazon Route 53 Console.
Create a Record Set, select the type TXT, add the value and create.
Back to Firebase and click verify, wait some time and you should be good to go. Check your custom name e.g. https://somedomain.name is pointing to the same website as the firebase hosting url e.g. https://yourproject.firebaseapp.com.
Congratulations 🎉🎉! You have successfully linked the project with your own domain! We are all done!
Conclusion
This tutorial illustrated how we can use the services from both Amazon and Google to host our own website with custom domain name. As I have stated in the beginning, it is a indicator of professionalism. And we have succeeded demonstrating it.
And your website is also backed by Google SSL certificate for extra security level for your website. No down time and fast. There is nothing more you can ask for of a free service from Google Firebase Hosting.
You can also use your same domain name to set up your business email using G Suite like somebody@yourcompanydomain.com. But i think i would not going into details and would like to stop at here.
This is the end of this tutorial and hope you find this useful :).
Have a nice day!
