Building the Chat App

The Socket.IO documentation offers a step-by-step easy-to-follow guide that will help us set up the chat app.

Dockerizing the Chat App

We'll create a Dockerfile in the root directory of our project. This file will contain the instructions Docker needs to build our application image.

# Using latest Node.js runtime as a parent image
FROM node:latest

# Setting the working directory inside the container
WORKDIR /app

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

# Install dependencies
RUN npm install

# Copy the rest of the application files
COPY . .

# Expose the port that the app runs on
EXPOSE 4000

# Command to run the app (start script in package.json)
CMD ["npm", "run", "dev"]

Here's a sample .dockerignore

# Ignore node_modules
node_modules

# Ignore the local development environment file
.env

# Ignore git files
.git
.gitignore

# Ignore Docker files
Dockerfile
.dockerignore

With our Dockerfile & .dockerignore ready, we can now build the Docker image. Run the following command in the project directory:

docker build -t my-chat-app .

• -t my-chat-app : Tags the resulting Docker image with the name my-chat-app.

• . : Specifies the current directory as the build context, indicating where Docker should look for the Dockerfile and all the necessary files and directories needed to build the Docker image.

Once the image is built, we can run a container based on it. Use the following command to start the container:

docker run -p 3000:4000 my-chat-app

This command maps port 3000 on our local machine to port 4000 in the container, allowing us to access the chat app via http://localhost:3000.

Push to Docker Hub

We can share Docker images using a Docker registry. The default registry is Docker Hub.

docker push YOUR-USER-NAME/chat-app

This command uploads the Docker image to Docker Hub under our account in the repository named chat-app. This makes it available for deployment and sharing with others who have access to your Docker Hub repository.

That's all! Find the code on my GitHub repo. Until next time...

Let's connect:

• LinkedIn

• GitHub