Deploying dockerized NextJS app to AWS EB - Part 1: Create dockerized app

Resources:

• Create NextJS docker container

Table of content:

• Create NextJS app
• Dockerize NextJS app

Hello everyone.

I assume that you already have Docker, NodeJS and YARN installed.

Create NextJS app

To create a new Nextjs app execute yarn create next-app app-name or you can pick an example app from there and create a new app with supplied command.

I'm going to pick blog starter example.
In the How to use section copy command

yarn create next-app --example blog-starter-typescript blog-starter-typescript-app

paste it in your terminal and hit enter.

Dockerize NextJS app

Open this awesome post and copy the final version of docker configuration.

Inside the root folder of your project (where package.json file is) create a new file named Dockerfile, paste copied configuration into it.

We need to tweak it a little (otherwise AWS will complain - try out yourself without deleting if you're curious):

1. delete image aliases (AS %alias_name% part of FROM statement)
2. replace used aliases with image indices (--from=deps becomes --from=0 and --from=BUILD_IMAGE becomes --from=1)

Our final Dockerfile:

# dependencies imageFROM node:14-alpineWORKDIR /appCOPY package.json yarn.lock ./RUN yarn install --frozen-lockfile# build imageFROM node:14-alpineWORKDIR /appCOPY --from=0 /app/node_modules ./node_modulesCOPY . .RUN yarn buildRUN rm -rf node_modulesRUN yarn install --production --frozen-lockfile --ignore-scripts --prefer-offline# build output imageFROM node:14-alpineENV NODE_ENV productionRUN addgroup -g 1001 -S nodejsRUN adduser -S nextjs -u 1001WORKDIR /appCOPY --from=1 --chown=nextjs:nodejs /app/package.json /app/yarn.lock ./COPY --from=1 --chown=nextjs:nodejs /app/node_modules ./node_modulesCOPY --from=1 --chown=nextjs:nodejs /app/public ./publicCOPY --from=1 --chown=nextjs:nodejs /app/.next ./.nextUSER nextjsEXPOSE 3000CMD [ "yarn", "start" ]

Also create .dockerignore file near Dockerfile and insert two directory names into it:

node_modules.next

To make sure it works run the following commands:

• docker build -t example-nextjs-app . - builds our image
• docker run -p 3000:3000 example-nextjs-app - runs our image

Now open localhost:3000 in your browser - you should see your app up and running. Yay =)

To stop docker image either kill (close) the terminal or stop the image:

1. execute command docker ps
2. copy container id
3. execute command docker stop container id

Thanks for reading. See you in the next part =)