A MEVN stack includes MongoDB, Express.js, Vue.js, and Node.js. Here's an easy example of a Docker Compose file for a MEVN app. This example thinks you have a basic MEVN app setup with different folders for the frontend (Vue.js) and backend (Express.js/Node.js).
Here's a basic directory structure for your MEVN application:
/my-mevn-app
|-- backend
| |-- app
| | `-- server.js
| `-- Dockerfile
|-- frontend
| |-- app
| | `-- main.js
| `-- Dockerfile
|-- docker-compose.yml
`-- .env
- backend/Dockerfile:
# Use an official Node.js runtime as a parent image
FROM node:14-alpine
# Set the working directory in the container
WORKDIR /usr/src/app
# Copy package.json and package-lock.json to the working directory
COPY package*.json ./
# Install app dependencies
RUN npm install
# Copy the current directory contents into the container
COPY . .
# Expose the port on which the app runs
EXPOSE 3000
# Command to run the application
CMD [ "npm", "start" ]
- frontend/Dockerfile:
# Use an official Node.js runtime as a parent image
FROM node:14-alpine
# Set the working directory in the container
WORKDIR /usr/src/app
# Copy package.json and package-lock.json to the working directory
COPY package*.json ./
# Install app dependencies
RUN npm install
# Copy the current directory contents into the container
COPY . .
# Expose the port on which the app runs
EXPOSE 8080
# Command to run the application
CMD [ "npm", "run", "serve" ]
- docker-compose.yml:
version: '3'
services:
backend:
build:
context: ./backend
ports:
- "3000:3000"
depends_on:
- database
environment:
- MONGODB_URI=mongodb://database:27017/mydatabase
frontend:
build:
context: ./frontend
ports:
- "8080:8080"
depends_on:
- backend
database:
image: "mongo:latest"
ports:
- "27017:27017"
environment:
- MONGO_INITDB_DATABASE=mydatabase
- .env (for backend):
MONGODB_URI=mongodb://database:27017/mydatabase
In this setup:
The
backend
service uses the official Node.js image, installs dependencies, and runs the Express.js application on port 3000. It depends on thedatabase
service (MongoDB).The
frontend
service uses the official Node.js image, installs dependencies, and runs the Vue.js application on port 8080. It depends on thebackend
service.The
database
service uses the official MongoDB image.The
.env
file contains the MongoDB connection URI for the backend service.
To run your MEVN application using Docker Compose, navigate to the directory containing your docker-compose.yml
file and run:
docker-compose up
This will start all the services defined in the Docker Compose file. You can access your Vue.js application at http://localhost:8080
and your Express.js API at http://localhost:3000
.