From 9461c7e1e0be8d023a87c6f297fcac4108c48de3 Mon Sep 17 00:00:00 2001 From: kuhanmuniam Date: Thu, 31 Mar 2016 10:54:23 -0700 Subject: [PATCH 01/32] added 2nd NavLink to 07-more-nesting --- lessons/07-more-nesting/README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/lessons/07-more-nesting/README.md b/lessons/07-more-nesting/README.md index be2025c6..0908c148 100644 --- a/lessons/07-more-nesting/README.md +++ b/lessons/07-more-nesting/README.md @@ -45,6 +45,7 @@ import NavLink from './NavLink' // ...
  • React Router
    • +
  • React
    • // ... ``` From 8a684607551bf9d4f6b0044dc5ac29709cb0d7b0 Mon Sep 17 00:00:00 2001 From: kuhanmuniam Date: Thu, 31 Mar 2016 10:55:51 -0700 Subject: [PATCH 02/32] added import Home to 08-index-routes --- lessons/08-index-routes/README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/lessons/08-index-routes/README.md b/lessons/08-index-routes/README.md index 7e86bcc7..7100cd8d 100644 --- a/lessons/08-index-routes/README.md +++ b/lessons/08-index-routes/README.md @@ -20,6 +20,7 @@ render `Home`: ```js // App.js +import Home from './Home' // ...
    From c3d1abdbdbaa6769c75794394473a0fc508e4786 Mon Sep 17 00:00:00 2001 From: Even Stensberg Date: Mon, 4 Apr 2016 07:08:15 +0200 Subject: [PATCH 03/32] Added information about spread attributes Added some information about spread attributes in the docs --- lessons/05-active-links/README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/lessons/05-active-links/README.md b/lessons/05-active-links/README.md index afed6d77..44343a77 100644 --- a/lessons/05-active-links/README.md +++ b/lessons/05-active-links/README.md @@ -51,6 +51,10 @@ primary navigation links need to know. It's useful to wrap those so you don't have to remember what your `activeClassName` or `activeStyle` is everywhere. +We will use an spread attribute here, the three dots. It clones our props +and in this use case it clones `activeClassName` to our desired component for +us to benefit from. + Create a new file at `modules/NavLink.js` that looks like this: ```js From efc41083136ad29e8daf0687a1c0b40f82faf484 Mon Sep 17 00:00:00 2001 From: Julian Grinblat Date: Mon, 4 Apr 2016 14:48:02 +0900 Subject: [PATCH 04/32] Fix minor typo --- lessons/02-rendering-a-route/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/02-rendering-a-route/README.md b/lessons/02-rendering-a-route/README.md index b01adadd..9fa98fa6 100644 --- a/lessons/02-rendering-a-route/README.md +++ b/lessons/02-rendering-a-route/README.md @@ -1,4 +1,4 @@ -# Rendering a Router +# Rendering a Route At its heart, React Router is a component. From 1666ac56fb4b3c7af62d3fc2e8a29715c9328ba6 Mon Sep 17 00:00:00 2001 From: Luis Herranz Date: Mon, 4 Apr 2016 17:57:50 +0200 Subject: [PATCH 05/32] Fix `listenBeforeLeavingRoute` error I had to add 'react/addons' as external due to a `Cannot read property 'listenBeforeLeavingRoute' of undefined` error. Got it from here https://github.com/reactjs/react-router/issues/1093#issuecomment-112920555 --- lessons/13-server-rendering/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/13-server-rendering/README.md b/lessons/13-server-rendering/README.md index 83259122..4a631854 100644 --- a/lessons/13-server-rendering/README.md +++ b/lessons/13-server-rendering/README.md @@ -37,7 +37,7 @@ module.exports = { // keep node_module paths out of the bundle externals: fs.readdirSync(path.resolve(__dirname, 'node_modules')).concat([ - 'react-dom/server' + 'react-dom/server', 'react/addons', ]).reduce(function (ext, mod) { ext[mod] = 'commonjs ' + mod return ext From e1e8bfd6bceb89e9cfa2c6504fa8582d8997b0bd Mon Sep 17 00:00:00 2001 From: vaibhav Date: Sat, 16 Apr 2016 21:14:25 +0530 Subject: [PATCH 06/32] grammar fix URLs is => URLs are --- lessons/10-clean-urls/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/10-clean-urls/README.md b/lessons/10-clean-urls/README.md index 41f27a5e..d0de7c6a 100644 --- a/lessons/10-clean-urls/README.md +++ b/lessons/10-clean-urls/README.md @@ -1,6 +1,6 @@ # Clean URLs with Browser History -The URLs in our app right now is built on a hack: the hash. Its the +The URLs in our app right now are built on a hack: the hash. Its the default because it will always work, but there's a better way. Modern browsers let JavaScript manipulate the URL without making an http From 54e790aa03e6a8433a33cf66a6a391f081e70e06 Mon Sep 17 00:00:00 2001 From: Lionel Date: Thu, 28 Apr 2016 16:51:01 +0200 Subject: [PATCH 07/32] Add missed packages in some lessons (#160) --- lessons/12-navigating/package.json | 1 + lessons/13-server-rendering/package.json | 1 + lessons/14-whats-next/package.json | 1 + 3 files changed, 3 insertions(+) diff --git a/lessons/12-navigating/package.json b/lessons/12-navigating/package.json index 2cb49262..3e4747fd 100644 --- a/lessons/12-navigating/package.json +++ b/lessons/12-navigating/package.json @@ -12,6 +12,7 @@ "license": "ISC", "dependencies": { "compression": "^1.6.1", + "express": "^4.13.4", "if-env": "^1.0.0", "react": "^0.14.7", "react-dom": "^0.14.7", diff --git a/lessons/13-server-rendering/package.json b/lessons/13-server-rendering/package.json index 2cb49262..3e4747fd 100644 --- a/lessons/13-server-rendering/package.json +++ b/lessons/13-server-rendering/package.json @@ -12,6 +12,7 @@ "license": "ISC", "dependencies": { "compression": "^1.6.1", + "express": "^4.13.4", "if-env": "^1.0.0", "react": "^0.14.7", "react-dom": "^0.14.7", diff --git a/lessons/14-whats-next/package.json b/lessons/14-whats-next/package.json index 21569ed1..f95b6f34 100644 --- a/lessons/14-whats-next/package.json +++ b/lessons/14-whats-next/package.json @@ -15,6 +15,7 @@ "license": "ISC", "dependencies": { "compression": "^1.6.1", + "express": "^4.13.4", "if-env": "^1.0.0", "react": "^0.14.7", "react-dom": "^0.14.7", From 31d3359cf15f36f0675e79cffe263d02a1cec6ba Mon Sep 17 00:00:00 2001 From: Tim Dorr Date: Thu, 28 Apr 2016 11:05:50 -0400 Subject: [PATCH 08/32] Update README.md --- lessons/05-active-links/README.md | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/lessons/05-active-links/README.md b/lessons/05-active-links/README.md index 44343a77..774d0e87 100644 --- a/lessons/05-active-links/README.md +++ b/lessons/05-active-links/README.md @@ -26,11 +26,10 @@ You can also use an active class name instead of inline-styles. ``` We don't have a stylesheet on the page yet though. Lets add one--extra -points if you can add a `link` tag from memory. Double extra points if -you can leave the attributes unquoted, against your better judgement. +points if you can add a `link` tag from memory. ```html - + ``` And the css file: From 2d08680eca5af168e103cc4d0087b827076734de Mon Sep 17 00:00:00 2001 From: Tim Dorr Date: Thu, 28 Apr 2016 11:08:35 -0400 Subject: [PATCH 09/32] Don't use an index for express.static. --- lessons/14-whats-next/server.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/14-whats-next/server.js b/lessons/14-whats-next/server.js index 34096ceb..9bcd1d6f 100644 --- a/lessons/14-whats-next/server.js +++ b/lessons/14-whats-next/server.js @@ -11,7 +11,7 @@ var app = express() app.use(compression()) // serve our static stuff like index.css -app.use(express.static(path.join(__dirname, 'public'))) +app.use(express.static(path.join(__dirname, 'public'), {index: false})) // send all requests to index.html so browserHistory works app.get('*', (req, res) => { From cc51006e47e52229885d0e6458f3cec6508f4cd9 Mon Sep 17 00:00:00 2001 From: franxois Date: Wed, 4 May 2016 18:39:15 +0200 Subject: [PATCH 10/32] Update ./module/routes.js (#165) Removed unnecessaries imports Router and browserHistory --- lessons/14-whats-next/modules/routes.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/14-whats-next/modules/routes.js b/lessons/14-whats-next/modules/routes.js index 72e9b82e..184df95c 100644 --- a/lessons/14-whats-next/modules/routes.js +++ b/lessons/14-whats-next/modules/routes.js @@ -1,5 +1,5 @@ import React from 'react' -import { Router, Route, browserHistory, IndexRoute } from 'react-router' +import { Route, IndexRoute } from 'react-router' import App from './App' import About from './About' import Repos from './Repos' From f54cf182587af728964d8a0a6225b9682f458d26 Mon Sep 17 00:00:00 2001 From: Rick Smith Date: Thu, 2 Jun 2016 14:35:34 -0600 Subject: [PATCH 11/32] Add missing word (#167) --- lessons/02-rendering-a-route/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/02-rendering-a-route/README.md b/lessons/02-rendering-a-route/README.md index 9fa98fa6..4445cd01 100644 --- a/lessons/02-rendering-a-route/README.md +++ b/lessons/02-rendering-a-route/README.md @@ -6,7 +6,7 @@ At its heart, React Router is a component. render(, document.getElementById('app')) ``` -That's not going display anything until we configure a route. +That's not going to display anything until we configure a route. Open up `index.js` and From 69f6cab845c33e506e879fc2f5c82f972cd68968 Mon Sep 17 00:00:00 2001 From: Tim Chan Date: Thu, 2 Jun 2016 13:36:07 -0700 Subject: [PATCH 12/32] Fixed misspellings. (#176) --- lessons/03-navigating-with-link/README.md | 2 +- lessons/05-active-links/README.md | 4 ++-- lessons/11-productionish-server/README.md | 2 +- lessons/12-navigating/README.md | 4 ++-- 4 files changed, 6 insertions(+), 6 deletions(-) diff --git a/lessons/03-navigating-with-link/README.md b/lessons/03-navigating-with-link/README.md index 4cb0d15d..c1aaa332 100644 --- a/lessons/03-navigating-with-link/README.md +++ b/lessons/03-navigating-with-link/README.md @@ -4,7 +4,7 @@ Perhaps the most used component in your app is `Link`. Its almost identical to the `` tag you're used to except that its aware of the `Router` it was rendered in. -Lets create some navigation in our `App` component. +Let's create some navigation in our `App` component. ```js // modules/App.js diff --git a/lessons/05-active-links/README.md b/lessons/05-active-links/README.md index 774d0e87..2085054c 100644 --- a/lessons/05-active-links/README.md +++ b/lessons/05-active-links/README.md @@ -25,8 +25,8 @@ You can also use an active class name instead of inline-styles.
  • Repos
    • ``` -We don't have a stylesheet on the page yet though. Lets add one--extra -points if you can add a `link` tag from memory. +We don't have a stylesheet on the page yet though. Lets add one-extra +point if you can add a `link` tag from memory. ```html diff --git a/lessons/11-productionish-server/README.md b/lessons/11-productionish-server/README.md index ef69f436..4603928d 100644 --- a/lessons/11-productionish-server/README.md +++ b/lessons/11-productionish-server/README.md @@ -88,7 +88,7 @@ app.get('*', function (req, res) { }) ``` -We also need to tell wepback to build to this new directory: +We also need to tell webpack to build to this new directory: ```js // webpack.config.js diff --git a/lessons/12-navigating/README.md b/lessons/12-navigating/README.md index 00d2c8f2..79e6aefc 100644 --- a/lessons/12-navigating/README.md +++ b/lessons/12-navigating/README.md @@ -1,10 +1,10 @@ # Navigating Programatically -While most navigation happens with `Link`, you can programatically +While most navigation happens with `Link`, you can programmatically navigate around an application in response to form submissions, button clicks, etc. -Let's make a little form in `Repos` that programatically navigates. +Let's make a little form in `Repos` that programmatically navigates. ```js // modules/Repos.js From a891b313a4d173ae77ceb04b82dfa9666d5f814d Mon Sep 17 00:00:00 2001 From: Felipe Vargas Date: Thu, 2 Jun 2016 13:36:24 -0700 Subject: [PATCH 13/32] Fix lesson 2 readme (#175) --- lessons/02-rendering-a-route/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/02-rendering-a-route/README.md b/lessons/02-rendering-a-route/README.md index 4445cd01..801cf0a3 100644 --- a/lessons/02-rendering-a-route/README.md +++ b/lessons/02-rendering-a-route/README.md @@ -10,7 +10,7 @@ That's not going to display anything until we configure a route. Open up `index.js` and -1. import `Router` and `Route` +1. import `Router`, `Route`, and `hashHistory` 2. render a `Router` instead of `App` ```js From 4e5773e2be5034c3518ef700081febe988e7c4d7 Mon Sep 17 00:00:00 2001 From: Levi Serebryanski Date: Thu, 2 Jun 2016 16:36:39 -0400 Subject: [PATCH 14/32] fix grammar and terminology (#178) --- lessons/05-active-links/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/05-active-links/README.md b/lessons/05-active-links/README.md index 2085054c..b32098f1 100644 --- a/lessons/05-active-links/README.md +++ b/lessons/05-active-links/README.md @@ -50,7 +50,7 @@ primary navigation links need to know. It's useful to wrap those so you don't have to remember what your `activeClassName` or `activeStyle` is everywhere. -We will use an spread attribute here, the three dots. It clones our props +We will use a spread operator here, the three dots. It clones our props and in this use case it clones `activeClassName` to our desired component for us to benefit from. From 718ffecd792b22c489b2b134281d2b31c7527f2f Mon Sep 17 00:00:00 2001 From: ziolau Date: Fri, 3 Jun 2016 04:36:56 +0800 Subject: [PATCH 15/32] Remove Link's import in App.js (#173) Link does not used in App.js --- lessons/09-index-links/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/09-index-links/README.md b/lessons/09-index-links/README.md index 3df1c84b..c2f79efc 100644 --- a/lessons/09-index-links/README.md +++ b/lessons/09-index-links/README.md @@ -27,7 +27,7 @@ First lets use the `IndexLink` ```js // App.js -import { IndexLink, Link } from 'react-router' +import { IndexLink } from 'react-router' // ...
  • Home
    • From 40031e414506527079be9643894e6fb1bcf30e4e Mon Sep 17 00:00:00 2001 From: Michael Date: Tue, 14 Jun 2016 07:28:19 -0700 Subject: [PATCH 16/32] grammar fix on 08-index-routes README (#181) --- lessons/08-index-routes/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/08-index-routes/README.md b/lessons/08-index-routes/README.md index 7100cd8d..d92d6f9a 100644 --- a/lessons/08-index-routes/README.md +++ b/lessons/08-index-routes/README.md @@ -42,7 +42,7 @@ Also, it just feels good to keep `App` decoupled from `Home` and let the route config decide what to render as the children. Remember, we want to build small apps inside small apps, not big ones! -Lets add a new route to `index.js`. +Let's add a new route to `index.js`. ```js // index.js From f97d0b7e1ff572aa6711fe29b54e6b8fdf9efddf Mon Sep 17 00:00:00 2001 From: livash Date: Wed, 29 Jun 2016 15:25:16 -0600 Subject: [PATCH 17/32] typo fixes (#187) --- lessons/02-rendering-a-route/README.md | 1 + lessons/05-active-links/README.md | 4 +++- lessons/08-index-routes/README.md | 2 +- lessons/10-clean-urls/README.md | 2 +- lessons/12-navigating/README.md | 2 +- 5 files changed, 7 insertions(+), 4 deletions(-) diff --git a/lessons/02-rendering-a-route/README.md b/lessons/02-rendering-a-route/README.md index 801cf0a3..72f776d9 100644 --- a/lessons/02-rendering-a-route/README.md +++ b/lessons/02-rendering-a-route/README.md @@ -66,6 +66,7 @@ export default React.createClass({ Now we can couple them to the app at their respective paths. ```js +// insert into index.js import About from './modules/About' import Repos from './modules/Repos' diff --git a/lessons/05-active-links/README.md b/lessons/05-active-links/README.md index b32098f1..7e3afcd4 100644 --- a/lessons/05-active-links/README.md +++ b/lessons/05-active-links/README.md @@ -21,6 +21,7 @@ Now as you navigate, the active link is red. You can also use an active class name instead of inline-styles. ```js +// modules/App.js
  • About
  • Repos
    • ``` @@ -29,6 +30,7 @@ We don't have a stylesheet on the page yet though. Lets add one-extra point if you can add a `link` tag from memory. ```html +// index.html ``` @@ -71,7 +73,7 @@ export default React.createClass({ Now you can go change your links to `NavLink`s. ```js -// App.js +// modules/App.js import NavLink from './NavLink' // ... diff --git a/lessons/08-index-routes/README.md b/lessons/08-index-routes/README.md index d92d6f9a..8732d223 100644 --- a/lessons/08-index-routes/README.md +++ b/lessons/08-index-routes/README.md @@ -19,7 +19,7 @@ One option is to see if we have any children in `App`, and if not, render `Home`: ```js -// App.js +// modules/App.js import Home from './Home' // ... diff --git a/lessons/10-clean-urls/README.md b/lessons/10-clean-urls/README.md index d0de7c6a..ade0fb9b 100644 --- a/lessons/10-clean-urls/README.md +++ b/lessons/10-clean-urls/README.md @@ -53,7 +53,7 @@ starts at a deep path, won't be able to find the files. ```html - + diff --git a/lessons/12-navigating/README.md b/lessons/12-navigating/README.md index 79e6aefc..46439ea7 100644 --- a/lessons/12-navigating/README.md +++ b/lessons/12-navigating/README.md @@ -52,7 +52,7 @@ First we can use the `browserHistory` singleton that we passed into `Router` in `index.js` and push a new url into the history. ```js -// Repos.js +// modules/Repos.js import { browserHistory } from 'react-router' // ... From fa2e161d8c37af18786876a88b2f26dd4c85bb95 Mon Sep 17 00:00:00 2001 From: Kyle Pollock Date: Wed, 29 Jun 2016 16:25:41 -0500 Subject: [PATCH 18/32] Fix typo (#188) --- lessons/05-active-links/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lessons/05-active-links/README.md b/lessons/05-active-links/README.md index 7e3afcd4..49aec02d 100644 --- a/lessons/05-active-links/README.md +++ b/lessons/05-active-links/README.md @@ -6,7 +6,7 @@ it links to is active so you can style it differently. ## Active Styles Let's see how it looks with inline styles, add `activeStyle` to your -`Links`s. +`Link`s. ```js // modules/App.js @@ -52,7 +52,7 @@ primary navigation links need to know. It's useful to wrap those so you don't have to remember what your `activeClassName` or `activeStyle` is everywhere. -We will use a spread operator here, the three dots. It clones our props +We will use a spread operator here, the three dots. It clones our props and in this use case it clones `activeClassName` to our desired component for us to benefit from. From f4516e341a743cfb43dcde6a686e08180704d2ba Mon Sep 17 00:00:00 2001 From: Jean Lange Date: Wed, 29 Jun 2016 17:26:12 -0400 Subject: [PATCH 19/32] small grammar change (#190) --- lessons/10-clean-urls/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lessons/10-clean-urls/README.md b/lessons/10-clean-urls/README.md index ade0fb9b..3eb8d916 100644 --- a/lessons/10-clean-urls/README.md +++ b/lessons/10-clean-urls/README.md @@ -1,6 +1,6 @@ # Clean URLs with Browser History -The URLs in our app right now are built on a hack: the hash. Its the +The URLs in our app right now are built on a hack: the hash. It's the default because it will always work, but there's a better way. Modern browsers let JavaScript manipulate the URL without making an http From 06eef1039f787074dc795574616f660a7d040b20 Mon Sep 17 00:00:00 2001 From: Matt Lane Date: Sun, 24 Jul 2016 19:34:45 -0700 Subject: [PATCH 20/32] fix typo, make App.js h1 name consistent (#191) --- lessons/04-nested-routes/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lessons/04-nested-routes/README.md b/lessons/04-nested-routes/README.md index c2c98330..bac8f2cd 100644 --- a/lessons/04-nested-routes/README.md +++ b/lessons/04-nested-routes/README.md @@ -46,7 +46,7 @@ automatically becomes nested UI. ## Sharing Our Navigation -Lets nest our `About` and `Repos` components inside of `App` so that we +Let's nest our `About` and `Repos` components inside of `App` so that we can share the navigation with all screens in the app. We do it in two steps: @@ -75,7 +75,7 @@ Next, render children inside of `App`. render() { return (
    -

    Ghettohub Issues

    +

    React Router Tutorial