dockerdocker-composedocker-toolbox

Docker: Mern project page isn't loading


I'm trying to run a MERN project with Docker Toolbox since i'm on a Windows machine but my project doesn't run.
This is my project folder structure:

 ├───api
 │   └───Dockerfile
 ├───ui
 │   └───Dockerfile
 ├───docker-compose.yml

docker-compose.yml

 version: '2'
 services:
   ui:
     build: ./ui
     ports:
       - '3000:3000'
     depends_on:
       - api
     #command: tail -f /dev/null
   api:
     build: ./api
     ports:
       - '8080:8080'
     depends_on:
       - mongo
   mongo:
     image: mongo
     ports:
       - '27017:27017'

./ui/Dockerfile

 FROM node:8
 # Create app directory
 WORKDIR /usr/src/app
 # Install app dependencies
 COPY package*.json ./

 RUN npm install
 # Copy app source code
 COPY . .

 #Expose port and start application
 EXPOSE 3000
 CMD ["npm", "start"]

./api/Dockerfile

 FROM node:8
 # Create app directory
 WORKDIR /usr/src/app
 # Install app dependencies
 COPY package*.json ./

 RUN npm install
 # Copy app source code
 COPY . .

 #Expose port and start application
 EXPOSE 8080
 CMD [ "npm", "start" ]

When I run docker-compose up --build from my root everything seems to compile properly but it exits with express-mongo-docker-tutorial_ui_1 exited with code 0

 ...
 ...
 ...
 ui_1     |
 ui_1     | > ui@0.1.0 start /usr/src/app
 ui_1     | > react-scripts start
 ui_1     |
 ui_1     | ℹ 「wds」: Project is running at http://172.27.0.4/
 ui_1     | ℹ 「wds」: webpack output is served from
 ui_1     | ℹ 「wds」: Content not from webpack is served from /usr/src/app/public
 ui_1     | ℹ 「wds」: 404s will fallback to /
 ui_1     | Starting the development server...
 ui_1     |
 express-mongo-docker-tutorial_ui_1 exited with code 0

docker-machine ip default prints out 192.168.99.101 so I go to 192.168.99.101:3000 but my page doesn't load

If I do docker ps I see

 CONTAINER ID        IMAGE                               COMMAND                  CREATED             STATUS              PORTS                      NAMES
 fd90ffb3323f        express-mongo-docker-tutorial_api   "docker-entrypoint.s…"   22 minutes ago      Up 22 minutes       0.0.0.0:8080->8080/tcp     express-mongo-docker-tutorial_api_1
 5ed2d070b45f        mongo                               "docker-entrypoint.s…"   22 minutes ago      Up 22 minutes       0.0.0.0:27017->27017/tcp   express-mongo-docker-tutorial_mongo_1

I tried the solution of adding command: tail -f /dev/null to my docker-compose.yml file and I do see the container

 CONTAINER ID        IMAGE                               COMMAND                  CREATED             STATUS              PORTS                      NAMES
 a1d54f603fca        express-mongo-docker-tutorial_ui    "docker-entrypoint.s…"   8 seconds ago       Up 7 seconds        0.0.0.0:3000->3000/tcp     express-mongo-docker-tutorial_ui_1
 321682880d04        express-mongo-docker-tutorial_api   "docker-entrypoint.s…"   9 seconds ago       Up 8 seconds        0.0.0.0:8080->8080/tcp     express-mongo-docker-tutorial_api_1
 d8e31d09f8e5        mongo                               "docker-entrypoint.s…"   10 seconds ago      Up 10 seconds       0.0.0.0:27017->27017/tcp   express-mongo-docker-tutorial_mongo_1

but when I go to 192.168.99.101:3000 my page still doesn't load. What am I doing wrong?


Solution

  • I figured it out, all I had to do was add tty:true in my docker-compose.yml

     ui:
      build: ./ui
      ports:
        - '3000:3000'
      depends_on:
        - api
      tty:true #<-----