add links to source code after each section the-road-to-learn-react#191

manuscript/chapter1.md

@@ -222,6 +222,8 @@ The scripts are defined in your *package.json*, and your basic React application
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2Tt3Vd8)
+  * Confirm the [changes from the last section](http://bit.ly/2Cc5CRw)
 * `npm start` your application and visit the application in your browser (Exit the command by pressing Control + C)
 * Run the `npm test` script
 * Run the `npm run build` script and verify that a *build/* folder was added to your project (you can remove it afterward. Note that the build folder can be used later on to [deploy your application](https://www.robinwieruch.de/deploy-applications-digital-ocean/))
@@ -336,6 +338,8 @@ You might have noticed the `className` attribute. It reflects the standard `clas
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H8H14h)
+  * Confirm the [changes from the last section](http://bit.ly/2H9KwHA)
 * Define more variables and render them in JSX
   * Use a complex object to represent a user with a first name and last name
   * Render the user properties in JSX
@@ -402,6 +406,8 @@ In your application, we will use `const` and `let` over `var` for the rest of th
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H9AqH2)
+  * Confirm the [changes from the last section](http://bit.ly/2H61Vkw)
 * Read about [ES6 const](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
 * Read about [ES6 let](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
 * Gain an understanding of immutable data structures:
@@ -477,6 +483,8 @@ The most useful benefit of HMR is that you can keep the application state after
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H6pn1j)
+  * Confirm the [changes from the last section](http://bit.ly/2H8C6jW)
 * Change your *src/App.js* source code a few times to see HMR in action
 * Watch the first 10 minutes of [Live React: Hot Reloading with Time Travel](https://www.youtube.com/watch?v=xsSnOQynTHs) by Dan Abramov
 
@@ -623,6 +631,8 @@ Start your app in a browser, and you should see both items of the list displayed
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H7jMHT)
+  * Confirm the [changes from the last section](http://bit.ly/2H6LKnb)
 * Read about [React lists and keys](https://reactjs.org/docs/lists-and-keys.html)
 * Recap the [standard built-in array functionalities in JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/)
 * Use more JavaScript expressions on your own in JSX
@@ -701,6 +711,8 @@ Your JSX should look more concise and readable now, as it omits the `function` s
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H6Mfh3)
+  * Confirm the [changes from the last section](http://bit.ly/2H92076)
 * Read about [ES6 arrow functions](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
 
 ## ES6 Classes
@@ -779,4 +791,4 @@ Congratulations, you have learned to bootstrap your first React application! Let
   * Arrow functions can be used to keep your functions concise
   * Classes are used to define components in React by extending them
 
-Now that you've completed the first chapter, it's advisable to experiment with the source code you have written so far and see what changes you can make on your own. You can find the source code in the [official repository](https://github.com/the-road-to-learn-react/hackernews-client/tree/5.1).
+Now that you've completed the first chapter, it's advisable to experiment with the source code you have written so far and see what changes you can make on your own. You can find the source code in the [official repository](http://bit.ly/2H6Mfh3).

manuscript/chapter2.md

@@ -94,6 +94,8 @@ Be careful not to mutate the state directly. Instead, you should use a method ca
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2Had8Rh)
+  * Confirm the [changes from the last section](http://bit.ly/2HacLWT)
 * Experiment with the local state
   * Define more initial state in the constructor
   * Use and access the state in your `render()` method
@@ -177,6 +179,8 @@ Later, you will be able to use computed property names to allocate values by key
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H9Ewif)
+  * Confirm the [changes from the last section](http://bit.ly/2HadAyX)
 * Experiment with ES6 object initializer
 * Read about [ES6 object initializer](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Object_initializer)
 
@@ -359,6 +363,8 @@ Run the application again and try the "Dismiss" button. What you experienced is
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H928n6)
+  * Confirm the [changes from the last section](http://bit.ly/2Ha1s0S)
 * Read about [the state and lifecycle in React](https://reactjs.org/docs/state-and-lifecycle.html)
 
 ## Bindings
@@ -1032,6 +1038,8 @@ The search functionality should work now. Try it yourself in the browser.
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HaaV8y)
+  * Confirm the [changes from the last section](http://bit.ly/2HaB8DB)
 * Read about [React events](https://reactjs.org/docs/handling-events.html)
 * Read about [higher-order functions](https://en.wikipedia.org/wiki/Higher-order_function)
 
@@ -1121,6 +1129,8 @@ But since the book uses JavaScript ES6 most of the time, you should stick to it.
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2Hae4oL)
+  * Confirm the [changes from the last section](http://bit.ly/2H9EDub)
 * Read about [ES6 destructuring](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment)
 
 ## Controlled Components
@@ -1163,6 +1173,8 @@ Local state management and unidirectional data flow might be new to you, but onc
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2Habuzc)
+  * Confirm the [changes from the last section](http://bit.ly/2HaRQ5P)
 * Read about [React forms](https://reactjs.org/docs/forms.html)
 * Learn more about [different controlled components](https://github.com/the-road-to-learn-react/react-controlled-components-examples)
 
@@ -1290,6 +1302,8 @@ By extracting these components from the App component, they become reusable. Sin
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H84S47)
+  * Confirm the [changes from the last section](http://bit.ly/2H62M4I)
 * Discover more components that can be split up like the Search and Table components, but wait until we've covered more of its concepts before you implement any of them.
 
 ## Composable Components
@@ -1353,6 +1367,8 @@ The "Search" text should now be visible next to your input field. When you use t
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H82ZVg)
+  * Confirm the [changes from the last section](http://bit.ly/2Hb4FwY)
 * Read about [the composition model of React](https://reactjs.org/docs/composition-vs-inheritance.html)
 
 ## Reusable Components
@@ -1441,6 +1457,8 @@ Now, whenever there is no `className` property specified in the Button component
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HcAyp4)
+  * Confirm the [changes from the last section](http://bit.ly/2H6q3Up)
 * Read about [how to pass props in React](https://www.robinwieruch.de/react-pass-props-to-component/)
 
 ## Component Declarations
@@ -1534,6 +1552,8 @@ Now you have one lightweight functional stateless component. When we need access
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HpBVzR)
+  * Confirm the [changes from the last section](http://bit.ly/2Hs4tsR)
 * Refactor the Table and Button component to stateless functional components
 * Read about [ES6 class components and functional stateless components](https://reactjs.org/docs/components-and-props.html)
 
@@ -1793,6 +1813,11 @@ After that, we use them in the columns: `<span style={smallColumn}>`. There diff
 
 But if you are new to React, I would recommend to stick to pure CSS and inline style for now.
 
+### Exercises:
+
+* Confirm your [source code for the last section](http://bit.ly/2HlA6Ed)
+  * Confirm the [changes from the last section](http://bit.ly/2HlA67b)
+
 {pagebreak}
 
 You have learned the basics on how to write your own React application! Let's recap the last chapter:
@@ -1813,4 +1838,4 @@ You have learned the basics on how to write your own React application! Let's re
 * **General**
   * Higher-order functions
 
-Again, it makes sense to take a break, internalize the lessons, and apply them on your own. Experiment with the source code you have written so far. The source code for this project is found in the [official repository](https://github.com/the-road-to-learn-react/hackernews-client/tree/5.2).
+Again, it makes sense to take a break, internalize the lessons, and apply them on your own. Experiment with the source code you have written so far. The source code for this project is found in the [official repository](http://bit.ly/2HlA6Ed).

manuscript/chapter3.md

@@ -189,6 +189,8 @@ The list of hits should now be visible in our application; however, two regressi
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HkOIDO)
+  * Confirm the [changes from the last section](http://bit.ly/2HkOHzK)
 * Read about [ES6 template literals](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Template_literals)
 * Read about [the native fetch API](https://developer.mozilla.org/en/docs/Web/API/Fetch_API)
 * Read about [data fetching in React](https://www.robinwieruch.de/react-fetching-data/)
@@ -314,6 +316,8 @@ The "Dismiss" button should work now, because the `onDismiss()` method is aware
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HmzEpb)
+  * Confirm the [changes from the last section](http://bit.ly/2HpC32j)
 * Read about the [ES6 Object.assign()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign)
 * Read about the [ES6 array (and object) spread operator](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Spread_operator)
 
@@ -393,6 +397,8 @@ You should be able to see the fetched data in your application by now. Everythin
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HnZObc)
+  * Confirm the [changes from the last section](http://bit.ly/2Ho99jl)
 * Read about [different ways for conditional renderings](https://www.robinwieruch.de/conditional-rendering-react/)
 * Read about [React conditional rendering](https://reactjs.org/docs/conditional-rendering.html)
 
@@ -611,6 +617,8 @@ You should be able to search different Hacker News stories now. We have interact
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HtekOK)
+  * Confirm the [changes from the last section](http://bit.ly/2HnYg0J)
 * Read about [synthetic events in React](https://reactjs.org/docs/events.html)
 * Experiment with the [Hacker News API](https://hn.algolia.com/api)
 
@@ -775,6 +783,8 @@ The request to the Hacker News API fetches more list items in one request than b
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2Hotq8c)
+  * Confirm the [changes from the last section](http://bit.ly/2Hmrj52)
 * Read about [ES6 default parameters](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Default_parameters)
 * Experiment with the [Hacker News API parameters](https://hn.algolia.com/api)
 
@@ -1208,6 +1218,8 @@ The application now has error handling in case the API request fails.
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HoLAGY)
+  * Confirm the [changes from the last section](http://bit.ly/2HquJnd)
 * Read about [React's Error Handling for Components](https://reactjs.org/blog/2017/07/26/error-handling-in-react-16.html)
 
 ## Axios instead of Fetch
@@ -1271,6 +1283,8 @@ This chapter has shown you how you can replace one library with another in React
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2Hotuos)
+  * Confirm the [changes from the last section](http://bit.ly/2HkpMMC)
 * Read about [why frameworks matter](https://www.robinwieruch.de/why-frameworks-matter/)
 
 {pagebreak}
@@ -1297,4 +1311,4 @@ Now you've learned to interact with an API in React! Let's recap the last chapte
   * Client-side caching
   * Axios as an alternative for the native fetch API
 
-Again, it makes sense to take a break, internalize the lessons and apply them on your own. Experiment with the parameters for the API endpoint to query different results. You can find the source code in the [official repository](https://github.com/the-road-to-learn-react/hackernews-client/tree/5.3.1).
+Again, it makes sense to take a break, internalize the lessons and apply them on your own. Experiment with the parameters for the API endpoint to query different results. You can find the source code in the [official repository](http://bit.ly/2Hotuos).

manuscript/chapter4.md

@@ -550,6 +550,8 @@ Snapshot tests usually stay pretty basic. You only want to make sure the compone
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H9GkI3)
+  * Confirm the [changes from the last section](http://bit.ly/2Ha22f6)
 * See how a snapshot test fails once you change your component's return value in the `render()` method
   * Accept or deny the snapshot change(s)
 * Keep your snapshots tests up to date when the implementation of components change in next chapters
@@ -634,6 +636,8 @@ Continue to unit test your components, but be sure to keep the tests simple and
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HaT2Gl)
+  * Confirm the [changes from the last section](http://bit.ly/2H842oa)
 * Write a unit test with Enzyme for your Button component
 * Keep your unit tests up to date during the following chapters
 * Read about [Enzyme and its rendering API](https://github.com/airbnb/enzyme)
@@ -798,6 +802,9 @@ If you run your tests again, you might see PropType errors for your components o
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2H8ILul)
+  * Confirm the [changes from the last section](http://bit.ly/2H843se)
+  * Note that the changes get reverted for the next section
 * Define the PropType interface for the Search component
 * Add and update the PropType interfaces when you add and update components in the next chapters
 * Read about [React PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html)
@@ -838,4 +845,4 @@ You have learned how to organize and test React code! Let's recap the last chapt
 * **General**
   * code organization allows you to scale your application with best practices
 
-You can find the source code in the [official repository](https://github.com/the-road-to-learn-react/hackernews-client/tree/5.4).
+You can find the source code in the [official repository](http://bit.ly/2H647bK).

manuscript/chapter5.md

@@ -150,6 +150,9 @@ Now we can access the input DOM element. In our case it wouldn't help much since
 
 ### Exercises
 
+* Confirm your [source code for the last section](http://bit.ly/2H8597l)
+  * Confirm the [changes from the last section](http://bit.ly/2H8EoQ4)
+  * Note that the changes get reverted for the next section
 * Read about [the usage of the ref attribute in React](https://www.robinwieruch.de/react-ref-attribute-dom-node/)
 * Read about [the ref attribute in general in React](https://reactjs.org/docs/refs-and-the-dom.html)
 
@@ -272,6 +275,8 @@ Initially, the Loading component will show when you start your application, beca
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HkQk0k)
+  * Confirm the [changes from the last section](http://bit.ly/2Hns4uz)
 * Use a library such as [Font Awesome](https://fontawesome.com/) to show a loading icon instead of the "Loading ..." text
 
 ## Higher-Order Components
@@ -418,6 +423,8 @@ Higher-order components are an advanced pattern in React. They have multiple pur
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HkoP7c)
+  * Confirm the [changes from the last section](http://bit.ly/2Ho9uT9)
 * Read [a gentle introduction to higher-order components](https://www.robinwieruch.de/gentle-introduction-higher-order-components/)
 * Experiment with the HOC you have created
 * Think about a use case where another HOC would make sense
@@ -957,6 +964,8 @@ We may need to accept the failing snapshot tests again for the Table component,
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HteRAe)
+  * Confirm the [changes from the last section](http://bit.ly/2HnYFAh)
 * Use a library like [Font Awesome](https://fontawesome.com/) to indicate the (reverse) sort. It could be an arrow up or arrow down icon next to each Sort header
 * Read about the [classnames library](https://github.com/JedWatson/classnames)
 
@@ -972,4 +981,4 @@ You have learned advanced component techniques in React! Let's recap the chapter
 * **ES6**
   * Rest destructuring to split up objects and arrays
 
-You can always find the source code in the [official repository](https://github.com/the-road-to-learn-react/hackernews-client/tree/5.5).
+You can always find the source code in the [official repository](http://bit.ly/2HteRAe).

manuscript/chapter6.md

@@ -273,6 +273,8 @@ Lifting state can go the other way as well: from child to parent component. It i
 
 ### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2Ho9AtZ)
+  * Confirm the [changes from the last section](http://bit.ly/2Hnuh9d)
 * Read about [lifting state in React](https://reactjs.org/docs/lifting-state-up.html)
 * Read about lifting state in [learn React before using Redux](https://www.robinwieruch.de/learn-react-before-using-redux/)
 
@@ -434,8 +436,10 @@ class App extends Component {
 
 The function instead of object approach in `setState()` fixes potential bugs, while increasing the readability and maintainability of your code. Further, it becomes testable outside of the App component. I advise exporting and testing it as practice.
 
-### Exercise:
+### Exercises:
 
+* Confirm your [source code for the last section](http://bit.ly/2HteTbk)
+  * Confirm the [changes from the last section](http://bit.ly/2Hmbz1T)
 * Read about [React using state correctly](https://reactjs.org/docs/state-and-lifecycle.html#using-state-correctly)
 * Export updateSearchTopStoriesState from the file
   * Write a test for it which passes the a payload (hits, page) and a made up previous state and finally expect a new state
@@ -466,4 +470,4 @@ You have learned advanced state management in React! Let's recap the last chapte
   * `setState()` can use a function to prevent stale state bugs
   * Existing external solutions that help you to tame the state
 
-You can find the source code in the [official repository](https://github.com/the-road-to-learn-react/hackernews-client/tree/5.6).
+You can find the source code in the [official repository](http://bit.ly/2HteTbk).