Here is the dockerfile for my react front end app
# Use an official Node.js runtime as the base image
FROM node:16.13.1
# Set the working directory inside the container
WORKDIR /app
# Copy package.json and package-lock.json (if available)
COPY package*.json ./
# Install dependencies
RUN npm install
# Copy the rest of the application code
COPY . .
# Build your React app for production (you might need to adjust this based on your setup)
# RUN npm run build
# Expose the port your app will run on (typically 80 for HTTP)
EXPOSE 5173
# Define the command to run your app (start script in package.json)
CMD ["npm", "run", "dev"]
Here is the command i used to build the image
docker build -t react-frontend-image .
Here is the command i used to run the container
docker run -it -p 5173:5173 --name react-frontend-container react-frontend-image
After that when i try to access the site on browser at localhost:5173 i get this error This page isn’t working
Here are the logs while running the container
VITE v4.4.5 ready in 517 ms
➜ Local: http://localhost:5173/ ➜ Network: use --host to expose ➜ press h to show help
The app is working just fine when I run it locally.
Looking at the container logs it seems like your app is only listening on the 127.0.0.1 interface.
When running inside a container youcan not connect to the 127.0.0.1.
You should configure the app to listen on 0.0.0.0 (probably via CMD ["npm", "run", "dev", "--host", "0.0.0.0"])