MongoNetwork ECONNREFUSED when renaming service and database - reactjs

I have a problem starting mongodb with Docker. I have some code which i want to reuse for different purpose. After i made a copy of that code everything worked just fine but after renaming the service, database and building everything again with
docker-compose -f docker-compose.dev.yml build
and running with
docker-compose -f docker-compose.dev.yml up
mongodb won't start and i get the ECONNREFUSED error. I tried to remove all the services and containers with
docker-compose -f docker-compose.dev.yml rm
docker rm $(docker ps -a -q)
but nothing seems to help. I also tried to discard all the changes i made (to the point where it worked) but it still doesn't work. I am quite new to programming itself and have no idea what is happening. What am i missing?
Also including my config.js, .env and docker-compose.dev.yml files.
Config.js
const config = {
http: {
port: parseInt(process.env.PORT) || 9000,
},
mongo: {
host: process.env.MONGO_HOST || 'mongodb://localhost:27017',
dbName: process.env.MONGO_DB_NAME || 'myresume',
},
};
module.exports = config;
.env
NODE_ENV=development
MONGO_HOST=mongodb://db:27017
MONGO_DB_NAME=myresume
PORT=9001
docker-compose.dev.yml
version: "3"
services:
myresume-service:
build: .
container_name: myresume-service
command: npm run dev
ports:
- 9001:9001
links:
- mongo-db
depends_on:
- mongo-db
env_file:
- .env
volumes:
- ./src:/usr/myresume-service/src
mongo-db:
container_name: mongo-db
image: mongo
ports:
- 27017:27017
volumes:
- myresume-service-mongodata:/data/db
environment:
MONGO_INITDB_DATABASE: "myresume"
volumes:
myresume-service-mongodata:

I am not completely sure but I think that your service needs the env var
MONGO_HOST=mongodb://mongo-db:27017 instead of the one that you have. The two services are only visible to each other that way. I believe you also need a network to connect the two of them.
something like this:
version: "3"
networks:
my-network:
external: true
services:
myresume-service:
build: .
container_name: myresume-service
command: npm run dev
ports:
- 9001:9001
links:
- mongo-db
depends_on:
- mongo-db
env_file:
- .env
volumes:
- ./src:/usr/myresume-service/src
networks:
- my-network
mongo-db:
container_name: mongo-db
image: mongo
ports:
- 27017:27017
volumes:
- myresume-service-mongodata:/data/db
environment:
MONGO_INITDB_DATABASE: "myresume"
networks:
- my-network
volumes:
myresume-service-mongodata:
you probably need to create the network using the command:
docker network create my-network

Related

Docker react image doesn't hot reload

Red all the posts around. Tried with lower "react-scripts" (mine is 5.0.1), used CHOKIDAR_USEPOLLING: 'true', basically everything on the first two pages on google.
Hot reloading still doesn't work. My docker-compose.yaml:
version: '3.3'
services:
database:
container_name: mysql
image: mysql
command: --default-authentication-plugin=mysql_native_password
environment:
MYSQL_ROOT_PASSWORD: toma123
MYSQL_DATABASE: api
MYSQL_USER: toma
MYSQL_PASSWORD: toma123
ports:
- '4306:3306'
volumes:
- mysql-data:/var/lib/mysql
php:
container_name: php
build:
context: ./php
ports:
- '9000:9000'
volumes:
- ./../api:/var/www/api
depends_on:
- database
nginx:
container_name: nginx
image: nginx:stable-alpine
ports:
- '8080:80'
volumes:
- ./../api:/var/www/api
- ./nginx/default.conf:/etc/nginx/conf.d/default.conf
depends_on:
- php
- database
react:
container_name: react
build:
context: ./../frontend
ports:
- '3001:3000'
volumes:
- node_modules:/home/app/node_modules
volumes:
mysql-data:
driver: local
node_modules:
driver: local
And my react Dockerfile
FROM node
RUN mkdir -p /home/app
WORKDIR /home/app
COPY package*.json ./
RUN npm install
COPY . .
CMD ["npm", "start"]
Even if a lot of your application is in Docker it doesn't mean you need to exclusively use Docker. Since one of Docker's primary goals is to prevent containers from accessing host files, it can be tricky to convince it to emulate a normal host live-development environment.
Install Node on your host. It's likely you have this anyways, or you can trivially apt-get install or brew install it.
Start everything except the front-end application you're developing using Docker; then start your application, on the host, in the normal way.
docker-compose up -d nginx
npm run dev
You may need to make a couple of configuration changes for this to work. For example, in this development environment, the database address will be localhost:4306, but when deployed it will be database:3306, and you'll need to do things like configure Webpack to proxy backend requests to http://localhost:8080. You might set environment variables in your docker-compose.yml for this, and in your code have them default to the things they are in the non-Docker development environment.
const dbHost = process.env.DB_HOST || 'localhost';
const dbPort = process.env.DB_PORT || 4306;
In your Compose setup, do not mount volumes: over your application code or libraries. Once you get up to the point of doing final integration testing on this code, build and run the actual image you're going to deploy. So that section of the Dockerfile might look like
version: '3.8'
services:
react:
build: ../frontend
ports:
- '3001:3000'
# no volumes:
# container_name: is also unnecessary

Traefik Django & React setup

Recently I came across server configuration using GitLab CI/CD and docker-compose, I have two separated repositories one for Django and the other for React JS on Gitlab.
The Django Repo contains the following production.yml file:
version: '3'
volumes:
production_postgres_data: {}
production_postgres_data_backups: {}
production_traefik: {}
services:
django: &django
build:
context: .
dockerfile: ./compose/production/django/Dockerfile
image: one_sell_production_django
platform: linux/x86_64
expose: # new
- 5000
depends_on:
- postgres
- redis
env_file:
- ./.envs/.production/.django
- ./.envs/.production/.postgres
command: /start
labels: # new
- "traefik.enable=true"
- "traefik.http.routers.django.rule=Host(`core.lwe.local`)"
postgres:
build:
context: .
dockerfile: ./compose/production/postgres/Dockerfile
image: one_sell_production_postgres
expose:
- 5432
volumes:
- production_postgres_data:/var/lib/postgresql/data:Z
- production_postgres_data_backups:/backups:z
env_file:
- ./.envs/.production/.postgres
traefik: # new
image: traefik:v2.2
ports:
- 80:80
- 8081:8080
volumes:
- "./compose/production/traefik/traefik.dev.toml:/etc/traefik/traefik.toml"
- "/var/run/docker.sock:/var/run/docker.sock:ro"
redis:
image: redis:6
This is work perfectly using the Traefik, I have also the following code for React JS repo:
version: '3.8'
services:
frontend:
build:
context: ./
dockerfile: Dockerfile
expose:
- 3000
labels: # new
- "traefik.enable=true"
- "traefik.http.routers.django.rule=Host(`lwe.local`)"
restart: 'always'
env_file:
- .env
Now I don't know how to connect both Django and React Js Repo using the Traefik and also how the CI/CD configuration should be, the following is the CI/CD configuration for Django Repo (I omitted unnecessary info and just include the deploy stage):
deploy:
stage: deploy
tags:
- docker
when: always
before_script:
- mkdir -p .envs/.production/
- touch .envs/.production/.django
- touch .envs/.production/.postgres
- touch .env
- chmod +x ./setup_env.sh
- sh setup_env.sh
- less .envs/.production/.django
- less .envs/.production/.postgres
- docker-compose -f production.yml build
- docker-compose -f production.yml run --rm django python manage.py migrate
script:
- docker-compose -f local.yml up -d

Docker is not saving django media files into project 'media' directory on production

App Description
I have an app with django-gunicorn for back-end and reactjs-nginx with front-end all containerized as well as hosted on aws ec2 instance.
Problem
On development environment, media files are being saved in the 'media' directory permanently. Tho, those files are only saved on the current running docker container on production time. As a result, the files will be removed when I rebuild/stopped the container for a new code push.
Expectation
I wanted to store the file on the 'media' folder for permanent use.
Important code
settings.py
ENV_PATH = Path(__file__).resolve().parent.parent
STATIC_ROOT = BASE_DIR / 'django_static'
STATIC_URL = '/django_static/'
MEDIA_ROOT = BASE_DIR / 'media/'
MEDIA_URL = '/media/'
docker-compose-production.yml
version: "3.3"
services:
db:
image: postgres
restart: always #Prevent postgres from stopping the container
volumes:
- ./data/db:/var/lib/postgresql/data
environment:
- POSTGRES_DB=postgres
- POSTGRES_USER=postgres
- POSTGRES_PASSWORD=postgres
ports:
- 5432:5432
nginx:
restart: unless-stopped
build:
context: .
dockerfile: ./docker/nginx/Dockerfile
ports:
- 80:80
- 443:443
volumes:
- static_volume:/code/backend/server/django_static
- ./docker/nginx/production:/etc/nginx/conf.d
- ./docker/nginx/certbot/conf:/etc/letsencrypt
- ./docker/nginx/certbot/www:/var/www/certbot
depends_on:
- backend
# Volume for certificate renewal
certbot:
image: certbot/certbot
restart: unless-stopped
volumes:
- ./docker/nginx/certbot/conf:/etc/letsencrypt
- ./docker/nginx/certbot/www:/var/www/certbot
entrypoint: "/bin/sh -c 'trap exit TERM; while :; do certbot renew; sleep 12h & wait $${!}; done;'"
backend:
restart: unless-stopped
build:
context: .
dockerfile: ./docker/backend/Dockerfile
entrypoint: /code/docker/backend/wsgi-entrypoint.sh
volumes:
- .:/code
- static_volume:/code/backend/server/django_static
expose:
- 8000
depends_on:
- db
volumes:
static_volume: { }
pgdata: { }
I finally figured out the issue. I forgot to add .:/code to my nginx volumes config in my docker-compose file. Thank to this answer
Updated nginx volumes confi
volumes:
- .:/code
- static_volume:/code/backend/server/django_static
- ./docker/nginx/production:/etc/nginx/conf.d
- ./docker/nginx/certbot/conf:/etc/letsencrypt
- ./docker/nginx/certbot/www:/var/www/certbot

React App doesn't refresh on changes using Docker-Compose

Consider the Docker compose
version: '3'
services:
frontend:
build:
context: ./frontend
container_name: frontend
command: npm start
stdin_open: true
tty: true
volumes:
- ./frontend:/usr/app
ports:
- "3000:3000"
backend:
build:
context: ./backend
container_name: backend
command: npm start
environment:
- PORT=3001
- MONGO_URL=mongodb://api_mongo:27017
volumes:
- ./backend/src:/usr/app/src
ports:
- "3001:3001"
api_mongo:
image: mongo:latest
container_name: api_mongo
volumes:
- mongodb_api:/data/db
ports:
- "27017:27017"
volumes:
mongodb_api:
And the React Dockerfile :
FROM node:14.10.1-alpine3.12
WORKDIR /usr/app
COPY package.json .
RUN npm i
COPY . .
Folder Structure :
-frontend
-backend
-docker-compose.yml
And inside Frontend :
And inside src :
When I change files inside src it doesn't reflect on the Docker side.
How can we fix this ?
Here is the answer :
If you are running on Windows, please read this: Create-React-App has some issues detecting when files get changed on Windows based machines. To fix this, please do the following:
In the root project directory, create a file called .env
Add the following text to the file and save it: CHOKIDAR_USEPOLLING=true
That's all!
Don't use same name dir for different services like you use /usr/app change this to /client/app for client and server/app for backend and then it all works and use environment:- CHOKIDAR_USEPOLLING=true and use FROM node:16.5.0-alpine and can use stdin_open: true

Deploying with docker-compose. Frontend is not reaching backend

So I'm running a web app which consist of 3 services with docker-compose.
A mongodb database container.
A nodejs backend.
A nginx container with static build folder which serves a react app.
Locally it runs fine and I'm very happy, when trying to deploy to a vps I'm facing an issue.
I've set the vps' nginx to reverse proxy to port 8000 which serves the react app, it runs as expected but I can not send requests to the backend, when I'm logged in the vps I can curl it and it responds, but when the web app sends requests, they hang.
My docker-compose:
version: '3.7'
services:
server:
build:
context: ./server
dockerfile: Dockerfile
image: server
container_name: node-server
command: /usr/src/app/node_modules/.bin/nodemon server.js
depends_on:
- mongo
env_file: ./server/.env
ports:
- '8080:4000'
environment:
- NODE_ENV=production
networks:
- app-network
mongo:
image: mongo:4.2.7-bionic
container_name: database
hostname: mongo
environment:
- MONGO_INITDB_ROOT_USERNAME=...
- MONGO_INITDB_ROOT_PASSWORD=...
- MONGO_INITDB_DATABASE=admin
restart: always
ports:
- 27017:27017
volumes:
- ./mongo/init-mongo.js:/docker-entrypoint-initdb.d/init-mongo.js:ro
networks:
- app-network
client:
build:
context: ./client
dockerfile: prod.Dockerfile
image: client-build
container_name: react-client-build
env_file: ./client/.env
depends_on:
- server
ports:
- '8000:80'
networks:
- app-network
networks:
app-network:
driver: bridge
volumes:
data-volume:
node_modules:
web-root:
driver: local

Resources