How to dockerize?

[Chase Steenbock]

I can't dockerize this app using the NextJS with-docker example, but it isn't working correctly. The docker container starts up and runs, but the app doesn't load when navigating to the URL. I've tested with a fresh NextJS app and it works fine, so I'm guessing something is set up different in this one that isn't compatible.
The only way I've gotten it to work is to copy the whole project into the image and run it with yarn start. However, this isn't ideal as it copies literally everything in the folder into the image which bloats the size immensely, making it slow to build, slow to upload to our repository, and slow to then download to our hosting environment. The NextJS example does some optimization (using the output: 'standalone' feature) and also only copies the modules that are actually needed which greatly reduces the size of the final image.
Our current method of making a docker image adds 10 minutes to our CICD pipeline just to build and upload the image.

[AbdelatifAitBara]

Hi @donkee,

I've created a Dockerfile for the version 2.0 of this solution :

# Use an official Node.js runtime as a parent image
FROM node:14-alpine

# Set the working directory to /app
WORKDIR /app

# Copy package.json and package-lock.json to the container
COPY package*.json ./

# Install dependencies
RUN apk update && apk add --no-cache nodejs npm && \
    npm ci --only=production

# Copy the rest of the application code to the container
COPY . .

# Build the TypeScript code (if applicable)
RUN npm run build

# Expose the port that the application will listen on
EXPOSE 3000

# Start the application
CMD ["npm", "start"]

• You can clone the repo from here
• Then create a Dockerfile on this same folder.
• Run :

docker build -t tokyo-image .

• And to deploy the container use :

docker run -p 3000:3000 --name tokyo_container -d tokyo-image

• Browse to : localhost:3000

I hope this is gonna be helpful.

[Chase Steenbock]

Hi @AbdelatifAitBara , thanks for commenting. This isn't a viable solution for me, however, since it still requires copying the entire project contents into the container. The NextJS Dockerfile copies some optimized files/folders that are generated when you have output set to standalone in the next config file. That SHOULD result in a smaller image (this is my goal, as creating the image and uploading it are taking up the majority of my build pipeline - 10+ minutes). The NextJS official solution doesn't seem to work with this project, however.

[AbdelatifAitBara]

Hi @donkee,

Ok, I got you now ;) , could you tell me please the smaller image size that you have achieved ?

[Chase Steenbock]

Hi @AbdelatifAitBara , my images are about 500MB right now.

[AbdelatifAitBara]

Hi @donkee,

Yea me as well, I got the same size anyway, if I find a better solution I'll keep you on touch.
Have a good day.