Command for HTTPS dev server (#212)

* HTTPS dev command.

* Remove unused declaration.

* check-node-version for dev:https

.gitignore

@@ -46,3 +46,8 @@ jspm_packages
 .vscode/
 static/dll.vendor.js
 dll
+
+# SSL cert stuff
+webpack_config/server.key
+webpack_config/server.crt
+webpack_config/server.csr

README.md

@@ -20,6 +20,16 @@ It generates app in `dist` folder.
 npm run test # run tests with Jest
 ```
 
+#### Dev (HTTPS):
+
+1. Create your own SSL Certificate (Heroku has a [nice guide here](https://devcenter.heroku.com/articles/ssl-certificate-self))
+2. Move the `.key` and `.crt` files into `webpack_config/server.*`
+3. Run the following command:
+
+```bash
+npm run dev:https
+```
+
 #### Derivation Check:
 ##### The derivation checker utility assumes that you have:
 1. Docker installed/available

package.json

@@ -109,6 +109,8 @@
     "pretest": "check-node-version --package",
     "dev": "node webpack_config/server.js",
     "predev": "check-node-version --package",
+    "dev:https": "HTTPS=true node webpack_config/server.js",
+    "predev:https": "check-node-version --package",
     "flow": "flow",
     "derivation-checker": "babel-node common/derivation-checker.js --presets es2015,stage-0,flow",
     "postinstall": "webpack --config=./webpack_config/webpack.dll.js",
@@ -116,9 +118,6 @@
     "precommit": "lint-staged"
   },
   "lint-staged": {
-    "*.{js,jsx}": [
-      "prettier --write --single-quote",
-      "git add"
-    ]
+    "*.{js,jsx}": ["prettier --write --single-quote", "git add"]
   }
 }

webpack_config/config.js

@@ -2,7 +2,7 @@
 const path = require('path');
 
 module.exports = {
-  port: 3000,
+  port: process.env.HTTPS ? 3443 : 3000,
   title: 'MEW',
   publicPath: process.env.BUILD_GH_PAGES ? '/react-semantic.ui-starter/' : '/',
   srcPath: path.join(__dirname, './../common'),

webpack_config/log-plugin.js

@@ -8,9 +8,12 @@ module.exports = class LogPlugin {
   }
 
   apply(compiler) {
+    const protocol = process.env.HTTPS ? 'https' : 'http';
     compiler.plugin('done', () => {
       console.log(
-        `> App is running at ${chalk.yellow(`http://localhost:${this.port}`)}\n`
+        `> App is running at ${chalk.yellow(
+          `${protocol}://localhost:${this.port}`
+        )}\n`
       );
     });
   }

webpack_config/server.js

@@ -2,6 +2,8 @@
 const path = require('path');
 const express = require('express');
 const webpack = require('webpack');
+const https = require('https');
+const fs = require('fs');
 const webpackConfig = require('./webpack.dev');
 const config = require('./config');
 const LogPlugin = require('./log-plugin');
@@ -60,4 +62,26 @@ app.get('*', (req, res) => {
   });
 });
 
-app.listen(port);
+if (process.env.HTTPS) {
+  let creds = {};
+  try {
+    creds.key = fs.readFileSync(path.resolve(__dirname, 'server.key'), 'utf8');
+  } catch (err) {
+    console.error('Failed to get SSL private key at webpack_config/server.key');
+    console.error(err);
+    process.exit(1);
+  }
+
+  try {
+    creds.cert = fs.readFileSync(path.resolve(__dirname, 'server.crt'), 'utf8');
+  } catch (err) {
+    console.error('Failed to get SSL certificate at webpack_config/server.crt');
+    console.error(err);
+    process.exit(1);
+  }
+
+  const httpsApp = https.createServer(creds, app);
+  httpsApp.listen(port);
+} else {
+  app.listen(port);
+}