Deploying dockerized NextJS App to AWS Elastic Beanstalk
Tags: aws, beanstalk, nextjs, docker
Published: 2021-08-16 14:16:04

##### Table of content:
- [Create dockerized NextJS app](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-beanstalk-with-custom-domain-3hpk) - previous part
- [Manual upload](#manual-upload)
    - [New Beanstalk application](#create-beanstalk-app)
    - [Existing Beanstalk application](#create-beanstalk-env)
- [Beanstalk CLI](#beanstalk-cli)
    - [Install EB CLI](#beanstalk-cli)
    - [Initialize application](#app-init)
    - [Deploy](#app-deploy)
    - [Update](#app-update)
- [Add custom domain](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-eb-part-3-setting-custom-domain-45bm) - next part
- [Set up redirects](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-elastic-beanstalk-part-4-setting-redirects-48h9) - part 4

Hello everyone.

In [previous part](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-beanstalk-with-custom-domain-3hpk) we created dockerized NextJS app. Now it's time to deploy.    
Everything in here is within AWS Free tier.

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!    

<a name="deploy-next-app"></a>
## Deployment to Beanstalk 
There are two ways to deploy our app to Beanstalk:
1. Manual upload to Beanstalk
1. Beanstalk CLI     
 
<a name="manual-upload"></a>    
### Manual upload to Beanstalk    
In your project folder delete `node_modules` directory (and `.next` if present), archive leftovers into zip archive. Switch to AWS Console.  

<a name="create-beanstalk-app"></a>    
#### New Beanstalk application    
If you don't have a Beanstalk application, we need to create one:
1. Open AWS Console [Beanstalk welcome page](https://eu-west-1.console.aws.amazon.com/elasticbeanstalk/home?region=eu-west-1#/welcome)
1. Click `Create application` button
1. Fill in application name and select platform `Docker`  
![application name and platform section configuration](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v2ri5gdtgkwh106mi38q.png)     

In `Application code` section select `Upload your code`, in `Source code origin` select `Local file` and choose created zip archive.  
![application code section configuration](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wivf7tk921w9tyh86nix.png)    

Finally, click `Create application`. It will take a few minutes to deploy our app.  

<a name="create-beanstalk-env"></a>     
#### Existing Beanstalk application    
If you already have a Beanstalk application, we need to create a new application for our NextJS app (skip to [create new environment](#new-env) if you want to use existing Beanstalk application):

1. In EB Console jump to `Applications` tab in the sidebar
1. Click `Create new application`
1. Fill in application name and click `Create`

<a name="new-env"></a>     
Now it's time to create a new environment for our Next app:

1. Open created application (if you was following previous step, you already there)
1. Tap `Create a new environment`
1. On `Select environment tier` step leave defaults (`Web server environment`) and click `Select`
1. Select `Docker` platform and upload your zip archive  
![create environment step](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f3v5iamjp602dz0i241z.png)

Finally, click `Create environment`.  

After it's done you'll be provided with a URL for your application.     

To update application, open environment in EB console and click `Upload and deploy`    

<a name="beanstalk-cli"></a>    
### Elastic Beanstalk CLI    
First you need to install EB CLI.  
Follow instructions [there](https://github.com/aws/aws-elastic-beanstalk-cli-setup) to install it using script.  

If for some reason it's not working (i.e. you're using Arch linux), follow the procedures [there](https://docs.aws.amazon.com/elasticbeanstalk/latest/dg/eb-cli3-install-advanced.html#eb-cli3-install-advanced.install).        

<a name="app-init"></a>    
#### Initialize application    
After it's installed and checked to work, we need to initialize our app: ```eb init -r eu-west-1 -p docker my-dockerized-next-app```
`-r eu-west-1` flag tells what region to use
`-p docker` flag tells that we're using docker
`my-dockerized-next-app` sets application name    

If you don't specify region flag, use `eb status` or check `config.yml` file to find what region is used.   

You can use application name that already exists in AWS EB Console - every environment you create with EB CLI will be created within existing EB application.

<a name="app-deploy"></a>    
#### Deploy     
Before proceeding, make sure all your files are commited - EB CLI will produce incorrect result if they are not.    

Now we can deploy our app to AWS: ```eb create --elb-type application my-nextjs-env```
`--elb-type application` tells to use Application Load Balancer - without this flag Classic Load Balancer (which is outdated) will be used
`my-nextjs-env` sets environment name
 
If environment with provided name already exists within selected application, it will be updated. 

<a name="app-update"></a>    
#### Update    
To update application, commit your changes and execute `eb deploy` command.     

In the [next part](https://dev.to/bnn1/deploying-dockerized-nextjs-app-to-aws-eb-part-3-setting-custom-domain-45bm) we are going to connect our domain to EB application. Hope to see you there =)

Thanks for reading.