This tutorial Node.JS app can be accessed here.
This node web app is a React web app served by Express. It is dockerized and then published on AWS Elastic Beanstalk.
First, create a react app named 'my-app' and go into the folder:
npx create-react-app my-app
cd my-app
Then, install and save express:
npm install express --save
Once you have finished the above steps, you may run the React app in the development mode:
npm run start
Create 'server.js' file as following and save it in the project root folder:
const express = require('express');
const bodyParser = require('body-parser')
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
const PORT = process.env.PORT || 8080;
const HOST = '0.0.0.0';
app.get('/hello', (req, res) => {
return res.send('Hello World!')
});
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(PORT);
console.log(`Running on http://${HOST}:${PORT}`);
In package.json file, add:
"proxy": "http://localhost:8080"
After finishing the above steps, you may run build on your React app:
npm run build
and run Express to serve the React app:
node server.js
To use docker, sign up on Docker and install Docker and/or Docker Desktop as needed.
Once Docker installation is complete, create a file named 'Dockerfile' by running:
touch Dockerfile
In the Dockerfile, specify the image you want to build from. The latest image number for node.js app is available on the Docker Hub.
FROM node:14
Next, create the working directory of your app:
WORKDIR /usr/src/app
Then, copy your package.json and install the dependencies by adding the following lines:
COPY package*.json ./
RUN npm install
To bundle the source code in your app, add:
COPY . .
Your app runs on port 8080, so add this line:
EXPOSE 8080
End by specify the command for starting your app:
CMD [ "node", "server.js" ]
The complete Dockerfile should look like this:
FROM node:14
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 8080
CMD [ "node", "server.js" ]
Create .dockerignore file and add the lines as following:
node_modules
npm-debug.log
This will prevent local node modules and debug logs from being copied into the Docker image.
Screenshot of .dockerignore:
To build the docker image, run the following command:
docker build -t <your username>/<your app name> .
To run the built image on port 49160, run:
docker run -p 49160:8080 -d <your username>/<your app name>
The -p flag redirects a public port to a private port inside the container.
To confirm that the image is running, run:
docker ps
In order to deploy a remote docker image to AWS Elastic Beanstalk, push the image to Docker Hub:
docker push <your username>/<your app name>:latest
Learn More
For reference, Node.JS has published a guide on how to dockerize a Node.JS app here.
If you have not used AWS Elastic Beanstalk before, you can get started by reading the documentations.
Create Dockerrun.aws.json file as following:
{
"AWSEBDockerrunVersion": "1",
"Image": {
"Name": "your-docker-username/repo-name",
"Update": "true"
},
"Ports": [
{
"ContainerPort": "8080"
}
]
}
This includes information on the remote docker image that Elastic Beanstalk should pull. We will then create a Elastic Beanstalk app and upload this file.
To set up your app on Elastic Beanstalk, first, go to Elastic Beanstalk console -> Applications, and click on "Create a New Application".
Enter your application name:
Click on "Create a New Environment" for the app you just created:
Select 'Web server environment' for this app:
For 'Platform', Choose 'Docker', and the platform branch and version as you like.
For 'Application code', choose 'Upload your code', and upload Dockerrun.aws.json you just created:
Navigate to 'Configure more options', and choose a preset configuration or create a configuration that contains a load balancer.
The app will be created in a moment and will be deployed at the elasticbeanstalk address:
Learn More
For reference, AWS has documentations on deploying docker container on AWS Elastic Beanstalk.
You may purchase a domain address on any platform as you like. This example will demonstrate how to connect your deployed app with an address purchased from Google Domains.
First, choose a domain name you like and purchase it.
The domain address will show in your Google Domains account after purchase. Go to 'DNS' on the left menu, and scroll to 'Custom resource records'
Add a CNAME record, put in your elastic beanstalk app address as 'data' and 'www' as 'name':
We also need to add custom name servers on 'DNS' page. We will do this in "Name Servers" section.
According to AWS, 'a hosted zone tells Route 53 how to respond to DNS queries for a domain'. Let's first create a hosted zone on AWS Route 53.
Navigate to Route 53 in AWS console, and then to 'Hosted zones'.
Click on 'Create Hosted Zone', and enter the domain address you just purchased:
A hosted zone will be created:
Copy the 'values' listed for type 'NS' one by one to 'custom name servers' in Google Domains:
Notice that changes made on Google Domains may take up to 48 hours to take effect.
To set up HTTPS, we should get an SSL certificate on AWS and link it to the domain address.
- Go to AWS Certificate Manager to request an SSL certificate. Choose to 'request a public certificate', enter your domain name when prompted, select 'DNS validation' as validation method. Then follow
Follow instructions and add CNAME record in Google Domains:
- Link to Elastic Beanstalk.
Go to your Elastic Beanstalk app, navigate to Configuration -> Load Balancer.
Edit the configuration of listeners for your load balancer. Choose 'HTTPS' and choose the SSL certificate you just received: