Docker compose with nginx keeps displaying welcome page
It's easy to mount your own hello world page. I'll explain it using the official nginx:latest image but you can do it for yourself with the bitnami image if you want.
First the very basic. Just run the nginx container (without docker-compose). I'll explain it in detail and basic, of course I can try to perform more advanced or faster commands to read files which are inside the container but this can be confusing for a beginner. So just run the container and name it my-nginx:
$ docker run --rm -d -p 80:80 --name my-nginx nginxGo to localhost:80, you'll see the default nginx page.Now you can exec inside the container by using it's name. exec will bring you 'inside the container' so you can check its files.
$ docker exec -it my-nginx bashroot@2888fdb672a1:/# cd /etc/nginx/root@2888fdb672a1:/etc/nginx# lsconf.d koi-utf mime.types nginx.conf uwsgi_paramsfastcgi_params koi-win modules scgi_params win-utfNow read the nginx.conf by using cat.The most important line in this file is:
include /etc/nginx/conf.d/*.conf;This means all the confs inside that directory are used/read.So go into /etc/nginx/conf.d/.
root@2888fdb672a1:~# cd /etc/nginx/conf.d/root@2888fdb672a1:/etc/nginx/conf.d# lsdefault.confThe default.conf is the only file. Inside this file you see the configuration:
listen 80;server_name localhost;location / { root /usr/share/nginx/html; index index.html index.htm;}server is local host, port is 80 and the file that will be displayed is in the directory /usr/share/nginx/html/
Now check that file in your container:
root@2888fdb672a1:/etc/nginx/conf.d# cat /usr/share/nginx/html/index.html<!DOCTYPE html><html><head><title>Welcome to nginx!</title><style> body { width: 35em; margin: 0 auto; font-family: Tahoma, Verdana, Arial, sans-serif; }</style>...It's the expected file. It's the 'Welcome to Nginx' page we can see.So how can we show our own index.html? By just mounting it in /usr/share/nginx/html.
You'll docker-compose.yaml will look like this.
version: '3'services: web: image: nginx:latest volumes: - ./code:/usr/share/nginx/html ports: - "80:80"The code directory just contains an index.html with hello world.Run docker-compose up -d --build and when you curl localhost:80 you will see your own index.html.
If you really want to put your code in /var/www/html instead of /usr/share/nginx you can do that.
Use your test.conf. Here you define to put your file in /var/www/html/:
server { listen 80; listen [::]:80; server_name test.local; index index.html; #Only a basic helloworld index.html file error_log /var/log/nginx/error.log; access_log /var/log/nginx/access.log; root /var/www/html;}In the compose you will overwrite the default.conf with your own conf where you tell nginx to look in /var/www/html. Your compose can look like this:
version: '3'services: web: image: nginx:latest volumes: - "./test.conf:/etc/nginx/conf.d/default.conf" - "./code:/var/www/html" ports: - "80:80"Now you will also see your own index.html while it's on your own specified location. Long answer but I hope this helps.
After struggling a lot on this question, I have figured out three factors that made my deploy with docker-compose work.
I did a website in nodejs.
We expose web part and nginx on port 80
Dockerfile for nodejs : [ important line is -> EXPOSE 80 ]
FROM node:14-alpineWORKDIR /COPY package.json ./EXPOSE 80RUN npm installCOPY . .CMD ["node", "bin/www"]Nginx.conf for nginx : [ important line is -> listen 80; ]
events {}http { server { listen 80; location / { proxy_pass http://nodejs:3000; } }}We give to nginx config file, the name and port of web's image
docker-compose.yaml :
[ important line is -> image: nodejs ] that is the name of web's image
AND
[ important line is -> ports: -"3000:3000" ] that is the port to run web's part
version: "3.7"services: nodejs: build: context: . dockerfile: Dockerfile image: nodejs container_name: nodejs restart: unless-stopped networks: - app-network ports: - "3000:3000" webserver: image: nginx container_name: webserver restart: unless-stopped ports: - "80:80" volumes: - ./nginx/nginx.conf:/etc/nginx/nginx.conf - ./nginx/:/etc/nginx/conf.d depends_on: - nodejs networks: - app-networknetworks: app-network: driver: bridgeNginx.conf for nginx : [ important line is -> proxy_pass http://nodejs:3000; ]
events {}http { server { listen 80; location / { proxy_pass http://nodejs:3000; } }}We give nginx's image, volumes as path for the config file to replace default one
Tree :
mainfolder.|_____nginx| |______nginx.conf||_____Dockerfile||_____docker-compose.yamldocker-compose.yaml :
[ important line is -> ./nginx/nginx.conf:/etc/nginx/nginx.conf ] to replace config file
version: "3.7"services: nodejs: build: context: . dockerfile: Dockerfile image: nodejs container_name: nodejs restart: unless-stopped networks: - app-network ports: - "3000:3000" webserver: image: nginx container_name: webserver restart: unless-stopped ports: - "80:80" volumes: - ./nginx/nginx.conf:/etc/nginx/nginx.conf depends_on: - nodejs networks: - app-networknetworks: app-network: driver: bridge