Complete Lesson 11: Productionish Server

Author: rich-farr

lessons/01-setting-up/npm-debug.log

@@ -0,0 +1,48 @@
+0 info it worked if it ends with ok
+1 verbose cli [ '/home/rich/.nvm/versions/node/v5.11.1/bin/node',
+1 verbose cli   '/home/rich/.nvm/versions/node/v5.11.1/bin/npm',
+1 verbose cli   'run',
+1 verbose cli   'start:prod' ]
+2 info using [email protected]
+3 info using [email protected]
+4 verbose run-script [ 'prestart:prod', 'start:prod', 'poststart:prod' ]
+5 info lifecycle [email protected]~prestart:prod: [email protected]
+6 silly lifecycle [email protected]~prestart:prod: no script for prestart:prod, continuing
+7 info lifecycle [email protected]~start:prod: [email protected]
+8 verbose lifecycle [email protected]~start:prod: unsafe-perm in lifecycle true
+9 verbose lifecycle [email protected]~start:prod: PATH: /home/rich/.nvm/versions/node/v5.11.1/lib/node_modules/npm/bin/node-gyp-bin:/home/rich/Dev_Academy/02_phase_two/05_week_five/react-router-tutorial/lessons/01-setting-up/node_modules/.bin:/home/rich/.nvm/versions/node/v5.11.1/bin:/home/rich/.nvm/versions/node/v5.11.1/lib/node_modules/npm/bin/node-gyp-bin:/home/rich/Dev_Academy/02_phase_two/05_week_five/react-router-tutorial/lessons/01-setting-up/node_modules/.bin:/home/rich/.nvm/versions/node/v5.11.1/bin:/home/rich/.nvm/versions/node/v5.11.1/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games
+10 verbose lifecycle [email protected]~start:prod: CWD: /home/rich/Dev_Academy/02_phase_two/05_week_five/react-router-tutorial/lessons/01-setting-up
+11 silly lifecycle [email protected]~start:prod: Args: [ '-c', 'webpack && node server.js' ]
+12 silly lifecycle [email protected]~start:prod: Returned: code: 255  signal: null
+13 info lifecycle [email protected]~start:prod: Failed to exec start:prod script
+14 verbose stack Error: [email protected] start:prod: `webpack && node server.js`
+14 verbose stack Exit status 255
+14 verbose stack     at EventEmitter.<anonymous> (/home/rich/.nvm/versions/node/v5.11.1/lib/node_modules/npm/lib/utils/lifecycle.js:239:16)
+14 verbose stack     at emitTwo (events.js:100:13)
+14 verbose stack     at EventEmitter.emit (events.js:185:7)
+14 verbose stack     at ChildProcess.<anonymous> (/home/rich/.nvm/versions/node/v5.11.1/lib/node_modules/npm/lib/utils/spawn.js:24:14)
+14 verbose stack     at emitTwo (events.js:100:13)
+14 verbose stack     at ChildProcess.emit (events.js:185:7)
+14 verbose stack     at maybeClose (internal/child_process.js:850:16)
+14 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:215:5)
+15 verbose pkgid [email protected]
+16 verbose cwd /home/rich/Dev_Academy/02_phase_two/05_week_five/react-router-tutorial/lessons/01-setting-up
+17 error Linux 3.19.0-32-generic
+18 error argv "/home/rich/.nvm/versions/node/v5.11.1/bin/node" "/home/rich/.nvm/versions/node/v5.11.1/bin/npm" "run" "start:prod"
+19 error node v5.11.1
+20 error npm  v3.8.6
+21 error code ELIFECYCLE
+22 error [email protected] start:prod: `webpack && node server.js`
+22 error Exit status 255
+23 error Failed at the [email protected] start:prod script 'webpack && node server.js'.
+23 error Make sure you have the latest version of node.js and npm installed.
+23 error If you do, this is most likely a problem with the tutorial package,
+23 error not with npm itself.
+23 error Tell the author that this fails on your system:
+23 error     webpack && node server.js
+23 error You can get information on how to open an issue for this project with:
+23 error     npm bugs tutorial
+23 error Or if that isn't available, you can get their info via:
+23 error     npm owner ls tutorial
+23 error There is likely additional logging output above.
+24 verbose exit [ 1, true ]

lessons/01-setting-up/package.json

@@ -4,11 +4,16 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "start": "webpack-dev-server --inline --content-base . --history-api-fallback"
+    "start": "if-env NODE_ENV=production && npm run start:prod || npm run start:dev",
+    "start:dev": "webpack-dev-server --inline --content-base public --history-api-fallback",
+    "start:prod": "webpack && node server.js"
   },
   "author": "",
   "license": "ISC",
   "dependencies": {
+    "compression": "^1.6.2",
+    "express": "^4.14.0",
+    "if-env": "^1.0.0",
     "react": "^0.14.7",
     "react-dom": "^0.14.7",
     "react-router": "^2.0.0"

lessons/01-setting-up/index.css renamed to lessons/01-setting-up/public/index.css

@@ -0,0 +1,20 @@
+var express = require('express')
+var path = require('path')
+var compression = require('compression')
+
+var app = express()
+
+app.use(compression())
+
+// serve our static stuff like index.css
+app.use(express.static(path.join(__dirname, 'public')))
+
+// send all requests to index.html so browserHistory in React Router works
+app.get('*', function (req, res) {
+  res.sendFile(path.join(__dirname, 'public', 'index.html'))
+})
+
+var PORT = process.env.PORT || 8080
+app.listen(PORT, function() {
+  console.log('Production Express server running at localhost:' + PORT)
+})

lessons/01-setting-up/index.html renamed to lessons/01-setting-up/public/index.html

@@ -1,11 +1,18 @@
+var webpack = require('webpack')
+
 module.exports = {
   entry: './index.js',
 
   output: {
-    filename: 'bundle.js',
-    publicPath: ''
+    path: 'public'
   },
 
+  plugins: process.env.NODE_ENV === 'production' ? [
+    new webpack.optimize.DedupePlugin(),
+    new webpack.optimize.OccurrenceOrderPlugin(),
+    new webpack.optimize.UglifyJsPlugin()
+  ] : [],
+
   module: {
     loaders: [
       { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015&presets[]=react' }