diff --git a/README.md b/README.md index ef5be9b..6b1c699 100644 --- a/README.md +++ b/README.md @@ -1,40 +1,28 @@ -# A simple MERN stack application +## Docker Setup -### Create a network for the docker containers +This project includes optimized Docker images for frontend and backend. You can run the entire stack locally using Docker Compose. -`docker network create demo` +### Run from Docker Hub -### Build the client +Pull the production-ready images and run: -```sh -cd mern/frontend -docker build -t mern-frontend . -``` +```bash +docker-compose up -d -### Run the client +## run on locally --- +Frontend: http://localhost:5173 +Backend API: http://localhost:5050 -`docker run --name=frontend --network=demo -d -p 5173:5173 mern-frontend` -### Verify the client is running +If you want to build your own images: -Open your browser and type `http://localhost:5173` +# Build backend +docker build -t /mern-backend:prod ./backend -### Run the mongodb container +# Build frontend +docker build -t /mern-frontend:prod ./frontend -`docker run --network=demo --name mongodb -d -p 27017:27017 -v ~/opt/data:/data/db mongo:latest` - -### Build the server - -```sh -cd mern/backend -docker build -t mern-backend . -``` - -### Run the server - -`docker run --name=backend --network=demo -d -p 5050:5050 mern-backend` - -## Using Docker Compose - -`docker compose up -d` +# Start services +docker-compose up -d +s diff --git a/docker-compose.yaml b/docker-compose.yaml deleted file mode 100644 index fecb786..0000000 --- a/docker-compose.yaml +++ /dev/null @@ -1,38 +0,0 @@ -services: - backend: - build: ./mern/backend - ports: - - "5050:5050" - networks: - - mern_network - environment: - MONGO_URI: mongodb://mongo:27017/mydatabase - depends_on: - - mongodb - - frontend: - build: ./mern/frontend - ports: - - "5173:5173" - networks: - - mern_network - environment: - REACT_APP_API_URL: http://backend:5050 - - mongodb: - image: mongo:latest - ports: - - "27017:27017" - networks: - - mern_network - volumes: - - mongo-data:/data/db - -networks: - mern_network: - driver: bridge - -volumes: - mongo-data: - driver: local # Persist MongoDB data locally - diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..6b7368a --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,41 @@ +services: + backend: + image: amanyadav860/mern-backend:prod # use your pushed backend image + container_name: mern_backend + ports: + - "5050:5050" + networks: + - mern_network + environment: + MONGO_URI: mongodb://mongodb:27017/mydatabase + depends_on: + - mongodb + + frontend: + image: amanyadav860/mern-frontend:prod # use your pushed frontend image + container_name: mern_frontend + ports: + - "5173:3000" # frontend serve runs on 3000 in container, map to 5173 locally + networks: + - mern_network + environment: + REACT_APP_API_URL: http://backend:5050 + + mongodb: + image: mongo:latest + container_name: mern_mongo + ports: + - "27017:27017" + networks: + - mern_network + volumes: + - mongo-data:/data/db + +networks: + mern_network: + driver: bridge + +volumes: + mongo-data: + driver: local + diff --git a/mern/backend/.dockerignore b/mern/backend/.dockerignore new file mode 100644 index 0000000..c034564 --- /dev/null +++ b/mern/backend/.dockerignore @@ -0,0 +1,8 @@ +node_modules +npm-debug.log +.git +.gitignore +Dockerfile +.dockerignore +tests +.env \ No newline at end of file diff --git a/mern/backend/Dockerfile b/mern/backend/Dockerfile index c6d703b..2d30d88 100644 --- a/mern/backend/Dockerfile +++ b/mern/backend/Dockerfile @@ -1,14 +1,13 @@ -FROM node:18.9.1 - +# stage first 1; +FROM node:18.9.1-alpine AS builder WORKDIR /app - -COPY package.json . - -RUN npm install - +COPY package.json package-lock.json* ./ +RUN npm ci --omit=dev +# stage second 2; +FROM node:18.9.1-alpine +WORKDIR /app +COPY --from=builder /app/node_modules ./node_modules COPY . . - EXPOSE 5050 - CMD ["npm", "start"] diff --git a/mern/frontend/.dockerignore b/mern/frontend/.dockerignore new file mode 100644 index 0000000..e3e4b7f --- /dev/null +++ b/mern/frontend/.dockerignore @@ -0,0 +1,75 @@ +# Dependencies +node_modules/ +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# Environment variables +.env +.env.local +.env.development +.env.test +.env.production + +# Logs +logs +*.log +loglevel + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Coverage directory used by tools like istanbul +coverage/ +.nyc_output/ + +# Dependency directories +.node_modules/ +jspm_packages/ + +# Optional npm cache directory +.npm + +# Optional REPL history +.node_repl_history + +# Build outputs +dist/ +build/ +.out/ +.next/ + +# IDE and editor files +.vscode/ +.idea/ +*.swp +*.swo +*~ + +# OS generated files +.DS_Store +.DS_Store? +._* +.Spotlight-V100 +.Trashes +ehthumbs.db +Thumbs.db + +# Git +.git/ +.gitignore + +# Docker +Dockerfile +.dockerignore + +# Temporary files +*.tmp +*.temp + +# Cache directories +.cache/ +.parcel-cache/ \ No newline at end of file diff --git a/mern/frontend/Dockerfile b/mern/frontend/Dockerfile index 0b34905..6034f63 100644 --- a/mern/frontend/Dockerfile +++ b/mern/frontend/Dockerfile @@ -1,23 +1,22 @@ -# Use the official image as a parent image -# Description: Dockerfile for the client side of the MERN stack application - -# Use the official image as a parent image -FROM node:18.9.1 - -# Set the working directory +#---------stage 1: build react app-------- +#base image +FROM node:18.9.1-alpine AS builder WORKDIR /app -# Copy the file from your host to your current location -COPY package.json . - -# Run the command inside your image filesystem -RUN npm install - -# Inform Docker that the container is listening on the specified port at runtime -EXPOSE 5173 - -# Copy the rest of your app's source code from your host to your image filesystem +# Copy package files and install all dependencies (including dev) +COPY package*.json ./ +RUN npm ci --include=dev --ignore-scripts COPY . . +# Build optimized production bundle +RUN npm run build +#---------stage 2: serve react -------- +FROM node:18.9.1-alpine +WORKDIR /app + +# Install a lightweight static file server +RUN npm install -g serve +# Copy built files only from the previous stage +COPY --from=builder /app/dist ./dist -# Run the specified command within the container -CMD ["npm", "run", "dev"] +EXPOSE 3000 +CMD ["serve", "-s", "dist"] \ No newline at end of file