Adding custom domain for AWS Elastic Beanstalk application
Tags: aws, beanstalk, docker, nextjs
Published: 2021-08-16 15:38:21

##### Table of content:
- [Create dockerized NextJS app](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-beanstalk-with-custom-domain-3hpk) - part 1
- [Deploy dockerized app to AWS EB](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-eb-part-2-deployment-to-beanstalk-47pj) - previous part
- [Connect domain to Route53](#custom-domain)
- [Set up SSL](#setup-ssl)
- [Set up redirects](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-elastic-beanstalk-part-4-setting-redirects-48h9) - next part

Hello everyone.

In previous part we [created dockerized NextJS app](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-beanstalk-with-custom-domain-3hpk) and [deployed it to AWS EB](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-eb-part-2-deployment-to-beanstalk-47pj).   

In this part we are going to connect custom domain to our Elastic Beanstalk application (to make website url fancy, like `mysuperwebsite.com`), obtain SSL certificate for our website and set up secure https connection to our website!

Everything in here is within AWS Free tier (except for domain, which can be bought for as cheap as $1).

Also please pay attention that all links to AWS I provide use my region of choice, if you're using different AWS region make sure to change it before making any changes!   

Lets get started =))  

<a name="custom-domain"></a>    
## Use custom domain for your application   

This step requires you to have, guess it, custom domain.  

First thing we need to do is to create a new hosted zone:
1. Open [Route53 console page](https://console.aws.amazon.com/route53/v2/hostedzones#) and click `Create hosted zone`
1. Fill in domain name (optionally description), in my case it is `borisnovikov.xyz`
1. Select Type - `Public hosted zone` and click `Create hosted zone`    

Now we need to visit our domain registrar and change domain nameservers.   
I'm using Namecheap but the process should be similar for every domain provider: place each value of NS record (from AWS Hosted zone) to Domain registrar nameservers
![ns records](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l5zw6wfaaozoq0py50v7.png)
It can take up to 48 hours to register new nameservers. 

To access website using our domain we need to add two alias records of type A: one for our main domain (borisnovikov.xyz) and the other is for subdomain (www website version): 
1. On Hosted zone page click `Create record`
1. Switch `Alias` toggler
1. Record type - `A`
1. Route traffic to - Beanstalk, then select region and environment
1. Click `Create record`  

Same for www but add `www` prefix to `Record name` field.    

![record configuration](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0tlmc88rnkj048fcnwnf.png)   

Wait a few minutes and voi la - our website is now accessible with our domain    

<a name="setup-ssl"></a>    
### Setting up SSL
To set up SSL we need to obtain SSL certificate:
1. Visit [AWS Certificate Manager](https://eu-west-1.console.aws.amazon.com/acm/home?region=eu-west-1#/firstrun/).  
1. Under `Provision certificates` click `Get started`
1. Click `Request a certificate`
1. Add two domain names: one for your website and the other for www version    

![adding domain names](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cdycf8mfxso3vazczpcx.png)    

Here I added wildcard domain (*.borisnovikov.xyz) - it will cover all subdomains including www or any other.    
Click `Next`, select `DNS Validation` and keep clicking `Next` until `Validation` step.  

Because we delegated domain management to AWS by setting nameservers, we need to validate ownership by expanding any domain and clicking `Create record in Route 53`. Click `Continue`.  

SSL certificate will be issued after a while (it can take up to 48 hours - usually within 30 minutes after nameservers delegation is completed).   

#### Adding secure connection to our website    
Next step is to add https listener to load balancer.

First we need to modify Load Balancer security group to allow secure connections:
1. Open [EC2 Dashboard](https://eu-west-1.console.aws.amazon.com/ec2/v2/home?region=eu-west-1)
1. In sidebar click Load Balancers
1. Select your Load balancer and scroll down `Description` tab until `Security` section
1. Copy security group name and open link near it
![security group name](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/751tdn46ur79eqeis0hc.png)

On the Security groups page search the page (Ctrl+F in most browsers) for security group name you copied earlier, click on Security group ID.

On opened page click `Edit inbound rules`, then click `Add rule`.  

Set `HTTPS` Type, Source - `Anywhere IPv4`, save rule and close the page.  

Now we will set https listener:
1. On [Load Balancers](https://eu-west-1.console.aws.amazon.com/ec2/v2/home?region=eu-west-1#LoadBalancers:sort=loadBalancerName) page select your load balancer
1. Select `Listeners` tab and copy default rule for HTTP listener (forwarding to ...)
1. Click button `Add listener`
1. Select `HTTPS` protocol from the dropdown 
1. In `Default actions` click `Add action` -> `Forward to`
1. From the `Target group` dropdown select the same group you copied earlier from HTTP listener default action
1. From `Security policy` dropdown select suitable policy (default `ELBSecurityPolicy-2016-08` policy is recommended). More about policies [here](https://docs.aws.amazon.com/elasticloadbalancing/latest/network/create-tls-listener.html)
1. Select `Default SSL Certificate` you created earlier. 
1. Click `Add listener`. 

Tada! You can now access your website via https protocol =)  

In the [next part](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-elastic-beanstalk-part-4-setting-redirects-48h9) we are going to set up redirects from http to https, from www to non-www. Hope to see you there =) 

Thanks for reading.