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 creat…


This content originally appeared on DEV Community and was authored by Boryamba

Resources:
Table of content:

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 image
FROM node:14-alpine
WORKDIR /app
COPY package.json yarn.lock ./
RUN yarn install --frozen-lockfile

# build image
FROM node:14-alpine
WORKDIR /app
COPY --from=0 /app/node_modules ./node_modules
COPY . .
RUN yarn build
RUN rm -rf node_modules
RUN yarn install --production --frozen-lockfile --ignore-scripts --prefer-offline

# build output image
FROM node:14-alpine

ENV NODE_ENV production

RUN addgroup -g 1001 -S nodejs
RUN adduser -S nextjs -u 1001
WORKDIR /app
COPY --from=1 --chown=nextjs:nodejs /app/package.json /app/yarn.lock ./
COPY --from=1 --chown=nextjs:nodejs /app/node_modules ./node_modules
COPY --from=1 --chown=nextjs:nodejs /app/public ./public
COPY --from=1 --chown=nextjs:nodejs /app/.next ./.next

USER nextjs

EXPOSE 3000

CMD [ "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 =)


This content originally appeared on DEV Community and was authored by Boryamba


Print Share Comment Cite Upload Translate Updates
APA

Boryamba | Sciencx (2021-08-16T12:41:55+00:00) Deploying dockerized NextJS app to AWS EB – Part 1: Create dockerized app. Retrieved from https://www.scien.cx/2021/08/16/deploying-dockerized-nextjs-app-to-aws-eb-part-1-create-dockerized-app/

MLA
" » Deploying dockerized NextJS app to AWS EB – Part 1: Create dockerized app." Boryamba | Sciencx - Monday August 16, 2021, https://www.scien.cx/2021/08/16/deploying-dockerized-nextjs-app-to-aws-eb-part-1-create-dockerized-app/
HARVARD
Boryamba | Sciencx Monday August 16, 2021 » Deploying dockerized NextJS app to AWS EB – Part 1: Create dockerized app., viewed ,<https://www.scien.cx/2021/08/16/deploying-dockerized-nextjs-app-to-aws-eb-part-1-create-dockerized-app/>
VANCOUVER
Boryamba | Sciencx - » Deploying dockerized NextJS app to AWS EB – Part 1: Create dockerized app. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/08/16/deploying-dockerized-nextjs-app-to-aws-eb-part-1-create-dockerized-app/
CHICAGO
" » Deploying dockerized NextJS app to AWS EB – Part 1: Create dockerized app." Boryamba | Sciencx - Accessed . https://www.scien.cx/2021/08/16/deploying-dockerized-nextjs-app-to-aws-eb-part-1-create-dockerized-app/
IEEE
" » Deploying dockerized NextJS app to AWS EB – Part 1: Create dockerized app." Boryamba | Sciencx [Online]. Available: https://www.scien.cx/2021/08/16/deploying-dockerized-nextjs-app-to-aws-eb-part-1-create-dockerized-app/. [Accessed: ]
rf:citation
» Deploying dockerized NextJS app to AWS EB – Part 1: Create dockerized app | Boryamba | Sciencx | https://www.scien.cx/2021/08/16/deploying-dockerized-nextjs-app-to-aws-eb-part-1-create-dockerized-app/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts