Dockerize Webapp

.gitignore

@@ -13,6 +13,9 @@ public/build/**
 !.gitkeep
 .tern-project
 
+# Logs
+logs
+
 # Mounted MongoDB data
 data
 
@@ -21,4 +24,4 @@ data
 
 # testing assets
 *.mp4
-screenshots/**/*.png
+screenshots/**/*.png

Dockerfile

@@ -1,19 +1,15 @@
-FROM node:10
+FROM node:10-slim
 
-# Create app directory
-WORKDIR /usr/src/app
-
-# Install app dependencies
-# A wildcard is used to ensure both package.json AND package-lock.json are copied
-# where available (npm@5+)
-COPY package*.json ./
+# From: https://stackoverflow.com/a/52092711
+# Create and define the node_modules's cache directory.
+RUN mkdir /usr/src/cache
+WORKDIR /usr/src/cache
 
+# Install the application's dependencies into the node_modules's cache directory.
+COPY package.json ./
+COPY package-lock.json ./
 RUN npm install
-# If you are building your code for production
-# RUN npm ci --only=production
 
-# Bundle app source
-COPY . .
-
-EXPOSE 8080
-CMD [ "npm", "start" ]
+# Create and define the application's working directory.
+RUN mkdir /usr/src/app
+WORKDIR /usr/src/app

README.md

@@ -1,6 +1,6 @@
 # HelloGOV
 
-[HelloGOV](https://www.hellogov.app/) is a project of [Hack for LA](http://hackforla.org/), a Code for America brigade. This project seeks to make it easy to add a call-to-rep tool to social posts, including state senates and assemblies, and federal legislators. 
+[HelloGOV](https://www.hellogov.app/) is a project of [Hack for LA](http://hackforla.org/), a Code for America brigade. This project seeks to make it easy to add a call-to-rep tool to social posts, including state senates and assemblies, and federal legislators.
 
 Our primary users are small grassroots organizations who run their own state legislature-level campaigns to advocate on issues most important to their work. Know an org that might be interested in testing? Get in touch with us on the Hack For LA Slack.
 
@@ -65,7 +65,7 @@ You only have to do this once.
   ```
 - start the application
   ```
-  $ npm run start-dev
+  $ docker-compose up webapp
   ```
 
 ### Populate the seed data

conf/config.js

@@ -1,18 +1,6 @@
 require('dotenv').config();
 const currentEnv = process.env.NODE_ENV;
 
-let config = {
-    marketingSiteUrl: 'http://hellogov.squarespace.com',
-    marketingPages: ['/request-beta-access', '/faq'],
-    dbIP:   "127.0.0.1",
-    dbPort: '27017',
-    fbCallbackUrl: 'http://localhost:8080/auth/facebook/callback',
-    appPort: '8080',
-    hellogovDomain: `http://localhost:8080`,
-    supportEmail: 'hellogovapp@gmail.com',
-    noReplyEmail: 'no-reply@hellogov.app'
-};
-
 let secrets = {
     dbLocalUser: `${process.env.LOCAL_DB_USER}`,
     dbLocalPassword: `${process.env.LOCAL_DB_PASSWORD}`,
@@ -30,6 +18,18 @@ let secrets = {
     googleCivicInfoApiKey: `${process.env.GOOGLE_CIVIC_INFO_API_KEY}`
 };
 
+let config = {
+    marketingSiteUrl: 'http://hellogov.squarespace.com',
+    marketingPages: ['/request-beta-access', '/faq'],
+    mongoUri: `mongodb://${secrets.dbUser}:${secrets.dbPassword}@${secrets.db}-shard-00-00-5sypa.mongodb.net:27017,${secrets.db}-shard-00-01-5sypa.mongodb.net:27017,${secrets.db}-shard-00-02-5sypa.mongodb.net:27017/${secrets.db}-${secrets.dbStage}?ssl=true&replicaSet=helloGov-shard-0&authSource=admin&retryWrites=true`,
+    mongoOptions: { useNewUrlParser: true },
+    fbCallbackUrl: 'http://localhost:8080/auth/facebook/callback',
+    appPort: '8080',
+    hellogovDomain: `http://localhost:8080`,
+    supportEmail: 'hellogovapp@gmail.com',
+    noReplyEmail: 'no-reply@hellogov.app'
+};
+
 const getEnvConfig = function() {
     return require(`./envs/${currentEnv}`);
 };

conf/envs/dev-docker.js

@@ -0,0 +1,8 @@
+let config = {
+    protocol: 'http',
+    hostname: `localhost:8080`,
+    mongoUri: 'mongodb://mongo:27017/hellogov',
+    mongoOptions: {}
+};
+
+module.exports = config;

conf/envs/development.js

@@ -1,6 +1,8 @@
 let config = {
     protocol: 'http',
-    hostname: `localhost:8080`
+    hostname: 'localhost:8080',
+    mongoUri: 'mongodb://localhost:27017/hellogov',
+    mongoOptions: {}
 };
 
 module.exports = config;

docker-compose.yml

@@ -1,12 +1,19 @@
-version: '2'
+# Define Docker Compose version.
+version: "3"
 
+# Define all the containers.
 services:
   webapp:
     build: .
+    depends_on:
+      - mongo
+    volumes:
+      - ./:/usr/src/app
     ports:
-      - "8080:8080"
-    env_file:
-      - webapp.env
+     - 8080:8080
+    environment:
+      NODE_ENV: development
+    command: /usr/src/app/entrypoint.sh
 
   mongo:
     image: mongo
@@ -25,8 +32,8 @@ services:
       - webapp
     # note: inside e2e container, the network allows accessing
     # "web" host under name "web"
-    # so "curl http://web" would return whatever the webserver
-    # in the "web" container is cooking
+    # so "curl http://webapp" would return whatever the webserver
+    # in the "webapp" container is cooking
     # see https://docs.docker.com/compose/networking/
     environment:
       - CYPRESS_baseUrl=http://webapp:8080
@@ -41,4 +48,4 @@ services:
     #     rebuild required).
     volumes:
       - ./e2e/cypress:/app/cypress
-      - ./e2e/cypress.json:/app/cypress.json
+      - ./e2e/cypress.json:/app/cypress.json

e2e/Dockerfile

@@ -1,8 +1,8 @@
 FROM cypress/base:10
 
-# Optionally pass proxy information to get internet connectivity within npm ci 
+# Optionally pass proxy information to get internet connectivity within npm ci
 # postinstall hooks when running behind corparate proxies.
-ARG http_proxy 
+ARG http_proxy
 ARG https_proxy
 ARG no_proxy
 

entrypoint.sh

@@ -0,0 +1,8 @@
+#!/bin/bash
+
+# Copy container-built node_modules.
+# From: https://stackoverflow.com/a/52092711
+
+cp -r /usr/src/cache/node_modules/. /usr/src/app/node_modules/
+# exec npm run build
+exec npm run start-docker

index.js

@@ -23,33 +23,18 @@ var routes = require('./app/routes');
 
 var app = express();
 
-const currentEnv = app.get('env');
-const localMongoUri = `mongodb://localhost:27017/hellogov`;
-const mongoUri = `mongodb://${config.dbUser}:${config.dbPassword}@${config.db}-shard-00-00-5sypa.mongodb.net:27017,${config.db}-shard-00-01-5sypa.mongodb.net:27017,${config.db}-shard-00-02-5sypa.mongodb.net:27017/${config.db}-${config.dbStage}?ssl=true&replicaSet=helloGov-shard-0&authSource=admin&retryWrites=true`;
-
-if (currentEnv === 'development') {
-    mongoose.connect(localMongoUri);
-} else {
-    mongoose.connect(mongoUri, { useNewUrlParser: true });
-}
+mongoose.connect(config.mongoUri, config.mongoOptions);
 mongoose.connection.on('error', function (err) {
     console.log('Mongo connection error', err.message);
 });
 mongoose.connection.once('open', function callback() {
     console.log('Connected to MongoDB');
 });
 
-if (currentEnv === 'production') {
-    var sessionStore = new MongoStore({
-        url: `${mongoUri}`,
-        touchAfter: 0
-    });
-} else {
-    var sessionStore = new MongoStore({
-        url: localMongoUri,
-        touchAfter: 0
-    });
-}
+var sessionStore = new MongoStore({
+    url: config.mongoUri,
+    touchAfter: 0
+});
 
 app.use(bodyParser.json());
 app.use(bodyParser.urlencoded({ extended: true }));

package.json

@@ -8,6 +8,7 @@
     "seed": "mongoimport -c users --uri mongodb://localhost:27017/hellogov --drop --file conf/seeds.json",
     "start": "NODE_ENV=production node index.js",
     "start-dev": "NODE_ENV=development nodemon index.js",
+    "start-docker": "NODE_ENV=dev-docker nodemon index.js",
     "stop-db": "pgrep mongod | xargs kill -2",
     "start-db": "mongod --port 27017 --dbpath /data/db --fork --logpath /usr/local/var/log/mongodb/mongod.log",
     "restart-db": "npm run stop-db && npm run start-db",