Add Dockerfile to backend/frontend and a docker-compose.yml to start …

…all services

backend/.dockerignore

@@ -0,0 +1 @@
+node_modules

backend/Dockerfile

@@ -0,0 +1,11 @@
+FROM node:current-alpine
+
+COPY . /app
+
+WORKDIR /app
+
+RUN npm install
+
+EXPOSE 3001
+
+ENTRYPOINT [ "npm", "run", "start" ]

backend/package.json

@@ -5,7 +5,9 @@
   "main": "server.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "dev": "nodemon server.js"
+    "dev": "nodemon server.js",
+    "start": "node server.js",
+    "demo": "node seeder.js && node server.js"
   },
   "keywords": [],
   "author": "",

backend/seeder.js

@@ -0,0 +1,84 @@
+const mongoose = require("mongoose");
+
+const mongodbHost = process.env.MONGODB_HOST || "localhost:27017";
+const database = process.env.MONGODB_DATABASE || "nodeapi";
+
+mongoose.connect(`mongodb://${mongodbHost}/${database}`, {
+  useNewUrlParser: true,
+  useUnifiedTopology: true
+});
+require("./src/models/Product");
+
+const Product = mongoose.model('Product');
+
+const products = [
+  {
+    title: "ReactJS",
+    description: "A declarative, efficient, and flexible JavaScript library for building user interfaces.",
+    url: "https://github.com/facebook/react"
+  },
+  {
+    title: "React Native",
+    description: "A framework for building native apps with React.",
+    url: "https://github.com/facebook/react-native"
+  },
+  {
+    title: "GraphQL",
+    description: "GraphQL is a query language and execution engine tied to any backend service.",
+    url: "https://github.com/facebook/graphql"
+  },
+  {
+    title: "Docosauros",
+    description: "Easy to maintain open source documentation websites.",
+    url: "https://github.com/facebook/docosauros"
+  },
+  {
+    title: "Nuclide",
+    description: "An open IDE for web and native mobile development, built on top of Atom",
+    url: "https://github.com/facebook/nuclide"
+  },
+  {
+    title: "create-react-app",
+    description: "Create React apps with no build configuration.",
+    url: "https://github.com/facebook/create-react-app"
+  },
+  {
+    title: "Metro",
+    description: "The JavaScript bundler for React Native.",
+    url: "https://github.com/facebook/metro"
+  },
+  {
+    title: "Relay",
+    description: "Relay is a JavaScript framework for building data-driven React applications.",
+    url: "https://github.com/facebook/relay"
+  },
+  {
+    title: "Flow",
+    description: "Adds static typing to JavaScript to improve developer productivity and code quality.",
+    url: "https://github.com/facebook/flow"
+  },
+  {
+    title: "Flipper",
+    description: "A desktop debugging platform for mobile developers.",
+    url: "https://github.com/facebook/flipper"
+  },
+  {
+    title: "Jest",
+    description: "Delightful JavaScript Testing.",
+    url: "https://github.com/facebook/jest"
+  },
+  {
+    title: "Watchman",
+    description: "Watches files and records, or triggers actions, when they change.",
+    url: "https://github.com/facebook/watchman"
+  },
+]
+
+products.forEach(async (item, index, array) => {
+  let product = new Product(item);
+  await product.save();
+  if ((index + 1) === array.length){
+    mongoose.disconnect();
+  }
+});
+

backend/server.js

@@ -3,13 +3,16 @@ const cors = require("cors");
 const mongoose = require("mongoose");
 const requireDir = require("require-dir");
 
+const mongodbHost = process.env.MONGODB_HOST || "localhost:27017";
+const database = process.env.MONGODB_DATABASE || "nodeapi";
+
 // Starting app
 const app = express();
 app.use(express.json());
 app.use(cors());
 
 // Connecting with DB
-mongoose.connect("mongodb://localhost:27017/nodeapi", {
+mongoose.connect(`mongodb://${mongodbHost}/${database}`, {
   useNewUrlParser: true,
   useUnifiedTopology: true
 });

docker-compose.yml

@@ -0,0 +1,36 @@
+version: '3.7'
+services:
+  frontend:
+    build:
+      context: ./frontend
+    ports:
+      - '3000:80'
+    networks:
+      - jshunt
+    environment:
+      - 'BACKEND_ADDRESS=localhost:3001'
+
+  backend:
+    build:
+      context: ./backend
+    entrypoint: [ "npm", "run", "demo" ]
+    ports:
+      - '3001:3001'
+    networks:
+      - jshunt
+    environment:
+      - 'MONGODB_HOST=mongodb'
+    depends_on:
+      - mongodb
+    deploy:
+      restart_policy:
+        condition: on-failure
+        delay: 5s
+
+  mongodb:
+    image: mongo
+    networks:
+      - jshunt
+
+networks:
+  jshunt:

frontend/.dockerignore

@@ -0,0 +1 @@
+node_modules

frontend/Dockerfile

@@ -0,0 +1,17 @@
+from node:current-alpine as build
+
+COPY . /app
+
+WORKDIR /app
+
+RUN yarn install
+
+RUN npm run build
+
+FROM nginx:alpine
+
+COPY --from=build /app/build /usr/share/nginx/html
+
+EXPOSE 80
+
+ENTRYPOINT [ "nginx", "-g", "daemon off;" ]

frontend/src/services/api.js

@@ -1,5 +1,7 @@
 import axios from 'axios';
 
-const api = axios.create({ baseURL: 'http://localhost:3001/api' });
+const backend = process.env.BACKEND_ADDRESS || 'localhost:3001';
+
+const api = axios.create({ baseURL: `http://${backend}/api` });
 
 export default api;