Skip to content

Instantly share code, notes, and snippets.

@tomasevich
Last active January 10, 2023 08:53
Show Gist options
  • Save tomasevich/f54c7c4d6fa00056386d7c8fc8bb11eb to your computer and use it in GitHub Desktop.
Save tomasevich/f54c7c4d6fa00056386d7c8fc8bb11eb to your computer and use it in GitHub Desktop.
VueJS + ExpressJS + Nginx + MongoDB
# DOCKER
.dockerignore
Dockerfile
docker-compose.yml
# OS
.DS_Store
# NPM
backend/node_modules
backend/package-lock.json
frontend/node_modules
frontend/package-lock.json
# APP
frontend/dist
# DATABASE
database/*
!database/.gitkeep
# OS
.DS_Store
# NPM
backend/node_modules
backend/package-lock.json
frontend/node_modules
frontend/package-lock.json
# APP
frontend/dist
# DATABASE
database/*
!database/.gitkeep

Docker & Docker-copose example for frontend/backend partails

File structure

  • backend/
  • database/
  • frontend/
  • webserver/
  • .dockerignore
  • .gitignore
  • docker-compose.yml
  • Dockerfile

Build & run

# Build & run & open browser
docker-compose up --build -d && open http://localhost/

# Stop
docker-compose stop && docker system prune <<< y
version: "3.7"
services:
database:
container_name: docker_database
build:
context: ./
target: database_stage
working_dir: /home/mysite.com
restart: unless-stopped
volumes:
- ./database:/data/db
environment:
- MONGO_INITDB_DATABASE=mysite
networks:
- docker_network
frontend:
container_name: docker_frontend
build:
context: ./
target: frontend_stage
working_dir: /home/mysite.com
depends_on: [ database ]
restart: "no"
backend:
container_name: docker_backend
build:
context: ./
target: backend_stage
working_dir: /home/mysite.com
restart: unless-stopped
depends_on: [ frontend ]
networks:
- docker_network
webserver:
container_name: docker_webserver
build:
context: ./
target: nginx_stage
restart: unless-stopped
ports:
- 80:80
depends_on: [ "backend" ]
networks:
- docker_network
networks:
docker_network:
# -------------------- DATABASE ---------------------- #
FROM mongo:latest as database_stage
WORKDIR /home/mysite.com
VOLUME [ "/data/db" ]
ENV MONGO_INITDB_DATABASE=mysite
EXPOSE 27017
CMD [ "mongod" ]
# -------------------- FRONTEND ---------------------- #
FROM node:latest as frontend_stage
WORKDIR /home/mysite.com
RUN chown -R node:node ./
COPY frontend/package*.json ./
RUN npm install --silent
COPY frontend/ ./
RUN npm run build
# -------------------- BACKEND ---------------------- #
FROM node:latest as backend_stage
WORKDIR /home/mysite.com
COPY backend/package*.json ./
RUN npm install --silent
COPY backend/ ./
EXPOSE 3000
CMD [ "npm", "start" ]
# -------------------- WEBSERVER ---------------------- #
FROM nginx:latest as nginx_stage
WORKDIR /usr/share/nginx/html
COPY --from=frontend_stage /home/mysite.com/dist ./frontend/
COPY webserver/*.html ./errors/
COPY webserver/nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD [ "nginx", "-g", "daemon off;" ]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment