diff --git a/lessons/01-setting-up/index.js b/lessons/01-setting-up/index.js
index 898eaa43..5df0c1d8 100644
--- a/lessons/01-setting-up/index.js
+++ b/lessons/01-setting-up/index.js
@@ -1,4 +1,23 @@
import React from 'react'
import { render } from 'react-dom'
import App from './modules/App'
-render( , document.getElementById('app'))
+import { Router, Route, browserHistory, IndexRoute } from 'react-router'
+import About from './modules/About'
+import Repos from './modules/Repos'
+import Repo from './modules/Repo'
+import Home from './modules/Home'
+
+render((
+
+
+
+
+
+
+
+
+
+
+
+
+ ), document.getElementById('app'))
diff --git a/lessons/01-setting-up/modules/About.js b/lessons/01-setting-up/modules/About.js
new file mode 100644
index 00000000..dc07ac3d
--- /dev/null
+++ b/lessons/01-setting-up/modules/About.js
@@ -0,0 +1,7 @@
+import React from 'react'
+
+export default React.createClass({
+ render() {
+ return
About
+ }
+})
\ No newline at end of file
diff --git a/lessons/01-setting-up/modules/App.js b/lessons/01-setting-up/modules/App.js
index cbbc7217..67579c31 100644
--- a/lessons/01-setting-up/modules/App.js
+++ b/lessons/01-setting-up/modules/App.js
@@ -1,7 +1,19 @@
import React from 'react'
+import NavLink from './NavLink'
+import Home from './Home'
export default React.createClass({
render() {
- return Hello, React Router!
+ return (
+
+
Ghetto hub issues
+
+ Kainga
+ About
+ Repos
+
+ {this.props.children}
+
+ )
}
})
diff --git a/lessons/01-setting-up/modules/Home.js b/lessons/01-setting-up/modules/Home.js
new file mode 100644
index 00000000..6e9a290f
--- /dev/null
+++ b/lessons/01-setting-up/modules/Home.js
@@ -0,0 +1,7 @@
+import React from 'react'
+
+export default React.createClass({
+ render () {
+ return Home
+ }
+})
\ No newline at end of file
diff --git a/lessons/01-setting-up/modules/NavLink.js b/lessons/01-setting-up/modules/NavLink.js
new file mode 100644
index 00000000..466ff310
--- /dev/null
+++ b/lessons/01-setting-up/modules/NavLink.js
@@ -0,0 +1,8 @@
+import React from 'react'
+import { Link } from 'react-router'
+
+export default React.createClass({
+ render() {
+ return
+ }
+})
\ No newline at end of file
diff --git a/lessons/01-setting-up/modules/Repo.js b/lessons/01-setting-up/modules/Repo.js
new file mode 100644
index 00000000..e372ea08
--- /dev/null
+++ b/lessons/01-setting-up/modules/Repo.js
@@ -0,0 +1,11 @@
+import React from 'react'
+
+export default React.createClass({
+ render() {
+ return (
+
+
{this.props.params.repoName}
+
+ )
+ }
+})
\ No newline at end of file
diff --git a/lessons/01-setting-up/modules/Repos.js b/lessons/01-setting-up/modules/Repos.js
new file mode 100644
index 00000000..73c0b157
--- /dev/null
+++ b/lessons/01-setting-up/modules/Repos.js
@@ -0,0 +1,35 @@
+import React from 'react'
+import NavLink from './NavLink'
+import { browserHistory } from 'react-router'
+
+export default React.createClass({
+
+ handleSubmit(event) {
+ event.preventDefault()
+ const userName = event.target.elements[0].value
+ const repoName = event.target.elements[1].value
+ const path = `/repos/${userName}/${repoName}`
+ console.log(path)
+ browserHistory.push(path)
+ },
+
+ render() {
+ return (
+
+
Repos
+
+ React Router
+ React
+
+
+
+
+ {this.props.children}
+
+ )
+ }
+})
\ No newline at end of file
diff --git a/lessons/01-setting-up/npm-debug.log b/lessons/01-setting-up/npm-debug.log
new file mode 100644
index 00000000..a6f1ba3e
--- /dev/null
+++ b/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 npm@3.8.6
+3 info using node@v5.11.1
+4 verbose run-script [ 'prestart:prod', 'start:prod', 'poststart:prod' ]
+5 info lifecycle tutorial@1.0.0~prestart:prod: tutorial@1.0.0
+6 silly lifecycle tutorial@1.0.0~prestart:prod: no script for prestart:prod, continuing
+7 info lifecycle tutorial@1.0.0~start:prod: tutorial@1.0.0
+8 verbose lifecycle tutorial@1.0.0~start:prod: unsafe-perm in lifecycle true
+9 verbose lifecycle tutorial@1.0.0~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 tutorial@1.0.0~start:prod: CWD: /home/rich/Dev_Academy/02_phase_two/05_week_five/react-router-tutorial/lessons/01-setting-up
+11 silly lifecycle tutorial@1.0.0~start:prod: Args: [ '-c', 'webpack && node server.js' ]
+12 silly lifecycle tutorial@1.0.0~start:prod: Returned: code: 255 signal: null
+13 info lifecycle tutorial@1.0.0~start:prod: Failed to exec start:prod script
+14 verbose stack Error: tutorial@1.0.0 start:prod: `webpack && node server.js`
+14 verbose stack Exit status 255
+14 verbose stack at EventEmitter. (/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. (/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 tutorial@1.0.0
+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 tutorial@1.0.0 start:prod: `webpack && node server.js`
+22 error Exit status 255
+23 error Failed at the tutorial@1.0.0 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 ]
diff --git a/lessons/01-setting-up/package.json b/lessons/01-setting-up/package.json
index 51792f8f..8a7a2930 100644
--- a/lessons/01-setting-up/package.json
+++ b/lessons/01-setting-up/package.json
@@ -4,11 +4,16 @@
"description": "",
"main": "index.js",
"scripts": {
- "start": "webpack-dev-server --inline --content-base ."
+ "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"
diff --git a/lessons/01-setting-up/public/index.css b/lessons/01-setting-up/public/index.css
new file mode 100644
index 00000000..7db13860
--- /dev/null
+++ b/lessons/01-setting-up/public/index.css
@@ -0,0 +1,3 @@
+.active {
+ color: chartreuse;
+}
\ No newline at end of file
diff --git a/lessons/01-setting-up/index.html b/lessons/01-setting-up/public/index.html
similarity index 60%
rename from lessons/01-setting-up/index.html
rename to lessons/01-setting-up/public/index.html
index 0a661421..c1a55fef 100644
--- a/lessons/01-setting-up/index.html
+++ b/lessons/01-setting-up/public/index.html
@@ -1,6 +1,7 @@
+
My First React Router App
-
+
diff --git a/lessons/01-setting-up/server.js b/lessons/01-setting-up/server.js
new file mode 100644
index 00000000..ff9018ed
--- /dev/null
+++ b/lessons/01-setting-up/server.js
@@ -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)
+})
\ No newline at end of file
diff --git a/lessons/01-setting-up/webpack.config.js b/lessons/01-setting-up/webpack.config.js
index c5866620..2389b1dd 100644
--- a/lessons/01-setting-up/webpack.config.js
+++ b/lessons/01-setting-up/webpack.config.js
@@ -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' }