Updates, 2016-10-15

basic-concepts.md

@@ -43,9 +43,9 @@
   https://youtu.be/5NIL3Epadj0  
   A talk by Jack Franklin, summarizing the state of modern web development.
 
-- **Modern JS Stack Training**  
-  https://github.com/verekia/modern-js-stack-training  
-  A repo that walks through concepts involved in a typical JS app, and how to set up each piece
+- **JavaScript Stack from Scratch**  
+  https://github.com/verekia/js-stack-from-scratch  
+  This is a minimalistic and straight to the point guide to assembling a JavaScript stack. It teaches you how to set up ES6, Babel, Gulp, ESLint, React, Redux, Webpack, Immutable, Mocha, Chai, Sinon, and Flow. It requires some general programming knowledge, and JavaScript basics. It focuses on wiring all these tools together and giving you the simplest possible example for each tool. You can see this tutorial as a way to write your own boilerplate from scratch.
 
 #### React Learning Guidelines
 

es6-features.md

@@ -40,6 +40,10 @@
   http://wesbos.github.io/ES6-Talk/  
   A set of slides describing the features in ES6
 
+- **Learn Harmony (ES2015 Now**  
+  http://learnharmony.org/  
+  An interactive tool for learning and experimenting with ES6/ES2015 features
+
 
 #### In-Depth Details
 
@@ -87,6 +91,10 @@
   http://untangled.io/in-depth-es6-destructuring-with-assembled-avengers/  
   A thorough set of examples for ES6's destructuring feature
 
+- **Using ES6 Generators and Yield to Implement Async Workflows**  
+  https://www.bennadel.com/blog/3123-using-es6-generators-and-yield-to-implement-asynchronous-workflows-in-javascript.htm  
+  A dive into how generators work, and how they can be used to handle async behavior
+
 
 #### Techniques
 

functional-programming.md

@@ -108,6 +108,22 @@
   http://www.brandonkeown.com/2016/10/lenses-for-fun-and-profit.html  
    Demonstrates the use of Ramda's "lens" concept for encapsulating data access
 
+- **Functional Lenses, How Do They Work**  
+  https://medium.com/@dtipson/functional-lenses-d1aba9e52254  
+  A dive into the "lens" concept, and how they can be used to manipulate data structures
+
 - **Don't Be Scared of Functional Programming**  
   https://www.smashingmagazine.com/2014/07/dont-be-scared-of-functional-programming/  
-  Several examples of functional programming principles, both in plain JS and with Underscore.js
+  Several examples of functional programming principles, both in plain JS and with Underscore.js
+
+- **Using Composition and Array Functions**  
+  http://ignaciochavez.com/using-composition-and-array-functions/  
+  Some useful examples of composing together different functions to accomplish a task.  Has some very nice diagrams illustrating the process.
+
+- **Dipping a toe into functional JS with lodash/fp**  
+  https://simonsmith.io/dipping-a-toe-into-functional-js-with-lodash-fp/  
+  Examples of using Lodash's functional API for logic and React component composition
+
+- **Composability: From Callbacks to Categories in ES6**  
+  https://medium.com/@homam/composability-from-callbacks-to-categories-in-es6-f3d91e62451e  
+  Explores different solutions to "callback hell", based on various FP concepts

git-resources.md

@@ -41,6 +41,10 @@
   https://codewords.recurse.com/issues/two/git-from-the-inside-out  
   An explanation of how Git works, by describing the internal data structures and the graph that they form.
 
+- **Ry's Git Tutorial**  
+  http://rypress.com/tutorials/git/index  
+  An excellent introduction to Git's key concepts and command.  Very well written and explained.
+
 
 #### Tips and Useful Info
 

javascript-resources.md

@@ -66,6 +66,14 @@ While this list is primarily focused on learning React and Redux, and generally
   http://watchandcode.com/p/practical-javascript  
   A free online course to learn Javascript fundamentals.
 
+- **Javascript Path**  
+  https://github.com/javascript-society/javascript-path  
+  A list of books to master JavaScript Development
+
+- **DevFreeBooks: Javascript**  
+  https://devfreebooks.org/javascript/  
+  A list of free online books for Javascript
+
 
 #### Interactive Exercises
 

pros-cons-discussion.md

@@ -141,6 +141,10 @@ similar structures in ClojureScript.
   https://news.ycombinator.com/item?id=12536634  
   Another very long thread about the JS ecosystem and versioning.  The linked comment describes how React, Redux, and Webpack have brought predictability to a particular application.
 
+- **"React perf and optimization tests"**  
+  https://twitter.com/AdamRackis/status/751486423232966656  
+  Discussion of React's performance compared to an existing Handlebars/Knockout app
+
 #### React's PATENTS License
 
 - **Facebook Open Source License FAQ**  

react-component-patterns.md

@@ -10,6 +10,11 @@
   https://medium.com/@arcomito/react-component-jargon-as-of-august-2016-28451d8ceb1d  
   A very useful glossary of widely-used terms describing React components
 
+- **React in Patterns**  
+  https://github.com/krasimir/react-in-patterns  
+  http://krasimirtsonev.com/blog/article/react-js-presentational-container-components  
+   List of design patterns/techniques used while developing with React
+
 - **Functional Components vs. Stateless Functional Components vs. Stateless Components**  
   https://tylermcginnis.com/functional-components-vs-stateless-functional-components-vs-stateless-components-630fdfd90c9c  
   Clarifies the meaning of the terms, which are often used in overlapping ways.
@@ -18,6 +23,10 @@
   https://medium.com/@dan_abramov/how-to-use-classes-and-sleep-at-night-9af8de78ccb4  
   Some pragmatic opinions on when and how to use the ES6 "class" keyword, particularly in relation to React components.
 
+- **Embracing Functions in React**  
+  https://medium.com/javascript-inside/embracing-functions-in-react-d7d558d8bd30  
+  A look at stateless functional components in React, and why they might be useful or should be considered in the first place.
+
 
 #### Component Categories
 
@@ -41,6 +50,10 @@
   https://medium.com/@rajaraodv/the-anatomy-of-a-react-redux-app-759282368c5a  
   Breaks down the component structure of a typical React/Redux app, and classifies the different types of components that usually show up
 
+- **React and Flux in Production Best Practices**  
+  https://medium.com/@delveeng/react-and-flux-in-production-best-practices-c87766c57cb6  
+  Delve's practice of describing components as "containers", "smart", and "dumb"
+
 
 #### Higher-Order Components
 
@@ -76,6 +89,18 @@
   https://medium.com/@franleplant/react-higher-order-components-in-depth-cf9032ee6c3e  
   A very detailed article looking at some advanced HoC patterns
 
+- **Real World Examples of Higher Order Components**  
+  http://rea.tech/reactjs-real-world-examples-of-higher-order-components/  
+  Explanations and examples of HOCs and their uses
+
+- **Function as Child Components**  
+  https://medium.com/merrickchristensen/function-as-child-components-5f3920a9ace9  
+  Explains the "function as a child" technique as an alternative to Higher Order Components
+
+- **Functions as Child Components and Higher Order Components**  
+  http://rea.tech/functions-as-child-components-and-higher-order-components/  
+  Comparisons and examples for these two component patterns
+
 
 #### Other Component Patterns
 
@@ -87,10 +112,23 @@
   http://blog.andrewray.me/the-reactjs-controller-view-pattern/  
   Describes using top-level components to hold state and pass it to children as props
 
-- **Function as Child Components**  
-  https://medium.com/merrickchristensen/function-as-child-components-5f3920a9ace9  
-  Explains the "function as a child" technique as an alternative to Higher Order Components
-
 - **Functional React Series - Part 1: Get your App outta my Component**  
   https://medium.com/@adamterlson/functional-react-series-part-1-get-your-app-outta-my-component-92656ae13e25  
-  Part 1 in a series about writing React applications by treating components as functions, not templates.
+  Part 1 in a series about writing React applications by treating components as functions, not templates.
+
+- **Make Your React Components Pretty**  
+  https://medium.com/walmartlabs/make-your-react-components-pretty-a1ae4ec0f56e  
+  Techniques for making your components easier to read, including using functional components, using JSX spread for props, and use of destructuring.
+
+- **Component Factories in React.js**  
+  https://github.com/szabototo89/create-it/blob/master/docs/article-full.md  
+  A variation on Dependency Injection for React components
+
+- **Functional Components with React stateless functions and Ramda**  
+  https://medium.com/@mirkomariani/functional-components-with-react-stateless-functions-and-ramda-e83e54fcd86b  
+  Examples of using Ramda functions to compose together components
+
+- **Mixins Considered Harmful**  
+  https://facebook.github.io/react/blog/2016/07/13/mixins-considered-harmful.html  
+  https://news.ycombinator.com/item?id=12087796  
+  Dan Abramov explains why the React team discourages use of mixins, and prefers HoCs

react-forms.md

@@ -32,6 +32,10 @@
 - **Managing state and controlled form fields with React**  
   https://blog.iansinnott.com/managing-state-and-controlled-form-fields-with-react/  
   Describes the concepts of "controlled" and "uncontrolled" inputs.  
+
+- **React Hates me: "Overcontrolled" components**  
+  http://www.matthiaslienau.de/blog/2015/4/8/react-hates-me-overcontrolled-components  
+  Describes some specific issues with controlled inputs and the preventDefault method
 
 
 #### Form Tutorials and Usage
@@ -49,7 +53,7 @@
   Explains how to set up more advanced form scenarios such as optional or repeatable sections.
 
 - **Using React's state to manage data entry**  
-  https://medium.com/@adamrackis/using-reacts-state-to-manage-data-entry-ed92e4fd1a42
+  https://medium.com/@adamrackis/using-reacts-state-to-manage-data-entry-ed92e4fd1a42  
   Describes how to manage data for forms using React component state and some wrapper components.
 
 - **Handling React Forms with Mobx Observables**  

react-performance.md

@@ -149,4 +149,8 @@ My [Redux Ecosystem Links](https://github.com/markerikson/redux-ecosystem-links)
 - **Chat discussion - single connected component vs many connected components**  
   https://gist.github.com/markerikson/6056565dd65d1232784bf42b65f8b2ad  
   An extended chat log discussing pros and cons of various approaches to managing connected components in a Redux app
+
+- **React Performance Debugging: The Magic of Reselect Selectors**  
+  http://rea.tech/reactjs-performance-debugging-aka-the-magic-of-reselect-selectors/  
+  Discussion of React perf topics, and how Reselect selector functions can improve perf for Redux apps
 

react-redux-architecture.md

@@ -152,3 +152,20 @@
   https://hackernoon.com/avoiding-accidental-complexity-when-structuring-your-app-state-6e6d22ad5e2a  
   An excellent set of guidelines for organizing your Redux store structure.
 
+- **Things I Wish I Knew About Redux**  
+  https://medium.com/horrible-hacks/things-i-wish-i-knew-about-redux-9924abf2f9e0  
+  https://www.reddit.com/r/javascript/comments/4taau2/things_i_wish_i_knew_about_redux/  
+  A number of excellent tips and lessons learned after building an app with Redux.  Includes info on connecting components, selecting data, and app/project structure.  Additional discussion on Reddit.
+
+- **Developing component-based web apps with React and Redux**  
+  https://medium.com/@carlos_paelinck/developing-component-based-web-apps-using-react-redux-6236bc958930  
+  Some examples of component structure and data handling in a drawing app.
+
+- **Switching from Backbone to React and Redux**  
+  https://medium.com/@royisch/moving-to-react-redux-in-baby-steps-aea0402624bf  
+  https://medium.com/@royisch/6-lessons-learned-from-going-to-production-with-react-redux-19257f6724f6  
+  A pair of articles describing one company's transition from a Backbone app to using React and Redux.
+
+- **Black Pixel Redux Handbook**  
+  http://bpxl-labs.github.io/redux-handbook/  
+  Black Pixel's guidelines for project/app structure and usage

react-redux-testing.md

@@ -126,6 +126,10 @@
   https://getstorybook.io/docs/testing/react-ui-testing  
   Looks at using the React Storybook component editor to do UI testing
 
+- **Testing React Components with mocha-webpack**  
+  https://medium.com/@mmontoya/testing-reactjs-components-with-mocha-webpack-ce7f710d268c  
+  Looks at how mocha-webpack can be used to enable faster testing for React components
+
 #### General Testing, Tools, and Setup
 
 - **Javascript Testing: Unit vs Functional vs Integration**  

react-state-management.md

@@ -7,8 +7,9 @@
   Describes different categories of state: data, communication, control, session, and location
 
 - **"M" and "C" in "MVC"**  
+  https://www.youtube.com/watch?v=fUpkYixd03k
   https://github.com/jamesknelson/m-and-c-in-mvc-talk  
-  Slides for James K. Nelson's talk at ReactNext, talking about the multiple categories of state and how controller components can manage them.
+  James K. Nelson's talk at ReactNext, talking about the multiple categories of state and how controller components can manage them.
 
 - **Exploring React's State Propagation**  
   https://www.sitepoint.com/exploring-reacts-state-propagation/  
@@ -21,10 +22,26 @@
 - **Dataflow through React**  
   https://jurassix.gitbooks.io/dataflow-through-react/content/index.html  
   An online book that covers a number of topics on React components and data flow.
+
+- **React Anti-Patterns: Props in Initial State**  
+  https://medium.com/@justintulk/react-anti-patterns-props-in-initial-state-28687846cc2e  
+  Discussion of why using props to initialize a component's state may or may not be a bad idea.
+
+- **How to safely use React context**  
+  https://medium.com/@mweststrate/how-to-safely-use-react-context-b7e343eff076  
+  Guidelines for when and how to actually use React's `context` feature
+
+- **Best Practices for Component State in React**  
+  http://brewhouse.io/blog/2015/03/24/best-practices-for-component-state-in-reactjs.html  
+  Some excellent suggestions and approaches for state handling and structure.
 
 
 #### Using `setState`
 
+- **React component state cheatsheet**  
+  https://twitter.com/dan_abramov/status/749710501916139520  
+  Dan Abramov pseudocodes his guidelines for when to put something into component state
+
 - **Where to Hold React Component Data: state, store, static, and this**  
   https://medium.freecodecamp.com/where-do-i-belong-a-guide-to-saving-react-component-data-in-state-store-static-and-this-c49b335e2a00  
   A great summary of different places to store state, and when and why you should use each.

react-styling.md

@@ -38,4 +38,8 @@
 
 - **Thoughts on Inline Styles**  
   https://medium.com/@andrewingram/my-thoughts-on-inline-styles-da94682b5e35  
-  A look at reasons why people might or might not use inline style approaches, and some opinions and suggestions on when to use different approaches.
+  A look at reasons why people might or might not use inline style approaches, and some opinions and suggestions on when to use different approaches.
+
+- **Style as a Function of State**  
+  https://medium.com/@rofrischmann/styles-as-functions-of-state-1885627a63f7  
+  A look at how styles can be managed similar to UI, and an example using the author's new styling library

react-tutorials.md

@@ -82,6 +82,11 @@
 - **React Cheat Sheet**  
   http://reactcheatsheet.com/  
   A filterable list of React's APIs and concepts
+
+- **How React Do?**  
+  http://blog.jfo.click/how-react-do/  
+  A tutorial written by someone as they learned React, stepping up through a series of React concepts.
+
 
 
 #### Project-Based Tutorials
@@ -169,6 +174,15 @@
   https://blog.tighten.co/react-101-part-4-firebase  
   A great 4-part series that progressively builds up a Giphy search engine
 
+- **#ReactForNewbies: Building a Todo App with Create-React-App**  
+  https://edemkumodzi.com/reactfornewbies-building-a-todo-app-with-create-react-app-part-1-5aae4bd637ee  
+  The first part of an ongoing series, written by someone who is writing the posts as he learns React.
+
+- **Rock and Roll React Tutorial**  
+  http://myappincome.co.uk/rock-and-roll-reactjs-tutorial-part-1/  
+  http://myappincome.co.uk/rock-and-roll-react-js-tutorial-part-2/  
+  http://myappincome.co.uk/rock-and-roll-react-js-tutorial-part-3/  
+  A tutorial that builds a React version of the Ember "Rock and Roll App" example.  Covers more intermediate topics, and is aimed at new React devs trying to grow their knowledge.
 
 #### React Implementation Walkthroughs
 
@@ -233,6 +247,22 @@
   https://facebook.github.io/react/blog/2016/09/28/our-first-50000-stars.html  
   A post celebrating React's progress, including a history of how React's concepts came together over time
 
+- **Tiny React Reimplementation**  
+  http://jsbin.com/qiguyibolu/1/edit?js,output  
+  A _very_ tiny (100 lines) implementation of React's basic algorithm
+
+- **What's Next for React - React Fiber**  
+  https://www.youtube.com/watch?v=aV1271hd9ew  
+  Andrew Clark describes the concepts, implementation, and potential benefits of the in-progress React Fiber internal algorithm reimplementation.
+
+- **React Implementation Notes**  
+  https://facebook.github.io/react/contributing/implementation-notes.html  
+  An in-depth explanation of how React's current internal algorithms work
+
+- **ReactJS: Under the Hood**  
+  https://www.youtube.com/watch?v=xsKYAa1ZXpQ  
+  A talk digging into React's internal concepts and implementation, including the split between the core library and the renderers.
+
 #### Paid Courses and Books
 
 Also see the course sites listed in the [Community Resources](community-resources.md#online-course-sites) page.

redux-side-effects.md

@@ -65,5 +65,8 @@
   https://medium.com/@andresmijares25/async-operations-using-redux-saga-2ba02ae077b3  
   An example of using Redux-Saga to coordinate multiple async calls based on another article's flight data scenario.
 
+- **Should I use redux-saga or not?**  
+  https://speakerdeck.com/kuy/should-i-use-redux-saga-or-not  
+  A presentation from Yuki Kodama, comparing side effect approaches.  In Japanese, but still has a number of useful diagrams that can be understood by English speakers.
 
 

redux-techniques.md

@@ -113,6 +113,12 @@
 - **Applying Redux Reducers to Arrays**  
   http://blog.scottlogic.com/2016/05/19/redux-reducer-arrays.html  
   Looks at one way to implement the classic "multiple instances of one connected component" issue in Redux.
+
+- **Redux: Encapsulating the Redux State Tree**  
+  http://randycoulman.com//blog/2016/09/13/encapsulating-the-redux-state-tree/  
+  http://randycoulman.com/blog/2016/09/20/redux-reducer-selector-asymmetry/  
+  http://randycoulman.com/blog/2016/09/27/modular-reducers-and-selectors/  
+  A blog series discussing approaches to encapsulating Redux data using selectors and other related approaches
 
 
 #### UI and Widget Implementations

redux-tutorials.md

@@ -76,6 +76,10 @@
 - **How to Use the React-Redux package**  
   http://code.tutsplus.com/tutorials/how-to-use-the-react-redux-package--cms-27150  
   An excerpt from the "Modern Web Apps with React and Redux" course, explaining how to use React-Redux to connect components to Redux.
+
+- **Pro React beta chapter: Using Redux**  
+  http://www.pro-react.com/materials/  
+  An alternative version of Pro React's chapter on using Flux that explains Redux usage
 
 
 #### Project-Based Tutorials