Got FE hot reloading working

config/nginx/nginx.conf

@@ -14,10 +14,17 @@ server {
 
   # Other to frontend
   location /sockjs-node {
+    proxy_set_header X-Real-IP  $remote_addr;
+    proxy_set_header X-Forwarded-For $remote_addr;
+    proxy_set_header Host $host;
+
+    proxy_pass http://frontend:4000;
+
+    proxy_redirect off;
+
     proxy_http_version 1.1;
     proxy_set_header Upgrade $http_upgrade;
     proxy_set_header Connection "upgrade";
-    proxy_pass http://frontend:80;
   }
 
   location / {

docker-compose.yml

@@ -7,6 +7,7 @@ services:
       - ./config/nginx:/bitnami/nginx/conf/vhosts
     depends_on:
       - backend
+      - frontend
     environment:
       - VIRTUAL_HOST=yourproject.docker
       - VIRTUAL_PORT=8080
@@ -27,10 +28,14 @@ services:
     ports:
       - "3000:3000"
   frontend:
-    build: frontend
+    build:
+      context: ./frontend/
+    depends_on:
+      - backend
+    command: npm start
     volumes:
-      - '/frontend/src:/usr/src/frontend-app/src'
-      - '/frontend/public:/usr/src/frontend-app/public'
+      - ./frontend/:/usr/src/frontend-app
+      - /usr/src/frontend-app/node_modules
     ports:
       - "35729:35729"
       - "4000:4000"

frontend/.dockerignore

@@ -1,4 +1,6 @@
 .git
 .idea
 node_modules
-build
+build
+npm-debug.log*
+npm-error.log*

frontend/Dockerfile

@@ -1,17 +1,13 @@
-FROM node:latest
+FROM node:9.4.0
 
-ADD yarn.lock /yarn.lock
-ADD package.json /package.json
+WORKDIR /usr/src/frontend-app
 
-ENV NODE_PATH=/node_modules
-ENV PATH=$PATH:/node_modules/.bin
-RUN yarn
+COPY package*.json ./
 
-WORKDIR /app
-ADD . /app
+RUN npm install -qy
+
+COPY . .
 
 EXPOSE 3000
-EXPOSE 35729
 
-ENTRYPOINT ["/bin/bash", "/app/run.sh"]
-CMD ["start"]
+CMD ["npm", "start"]

frontend/src/App.js

@@ -7,8 +7,13 @@ class App extends Component {
     return (
       <div className="App">
         <header className="App-header">
+          <h1>
+            Hello world
+          </h1>
         </header>
-
+        <p>
+          Build something cool!
+        </p>
       </div>
     );
   }