Updates, 2016-12-11

README.md

@@ -52,6 +52,7 @@ You might also want to check out my categorized list of Redux-related addons, li
   - [Redux Middleware](./redux-middleware.md)
   - [Redux Side Effects](redux-side-effects.md)
   - [Redux Tips and Techniques](redux-techniques.md)
+  - [Using Redux Without React](./redux-without-react.md)
 - **Other**
   - [Webpack Advanced Techniques](webpack-advanced-techniques.md)
   - [Static Typing](./static-typing.md)

basic-concepts.md

@@ -47,7 +47,7 @@
   https://medium.com/@shubheksha/javascript-package-managers-101-9afd926add0a  
   An overview of what packages and package managers are, some related terms, and how these tools work.
 
-  
+
 #### Suggested Learning Approaches
 
 - **A Study Plan to Cure Javascript Fatigue**  
@@ -74,6 +74,10 @@
 - **Front-End Developer Handbook**  
   https://www.frontendhandbook.com/  
   A guide that anyone could use to learn about the practice of front-end development. It broadly outlines and discusses the practice of front-end engineering: how to learn it and what tools are used when practicing it.
+
+- **Top Javascript Frameworks and Topics to Learn in 2017**  
+  https://medium.com/javascript-scene/top-javascript-frameworks-topics-to-learn-in-2017-700a397b711  
+  Eric Elliott gives some solid advice on what concepts, tools, and technologies are most valuable to learn today, as well as what related technologies are useful but optional.
 
 
 #### General Suggestions for Learning

es6-features.md

@@ -71,9 +71,8 @@
   http://appendto.com/2016/06/why-do-es6-classes-exist-and-why-now/  
   Digs into some of the intricacies of ES6 classes, and some of the pros and cons around using them
 
-- **When 'not' to use arrow functions**  
-  http://rainsoft.io/when-not-to-use-arrow-functions-in-javascript/  
-  An in-depth look at when you should stick with standard JS functions instead of arrow functions
+
+
 
 #### Specific Features
 
@@ -107,8 +106,6 @@
   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
 
-
-
 - **A Practical Introduction to ES6 Generator Functions**  
   http://thejsguy.com/2016/10/15/a-practical-introduction-to-es6-generator-functions.html  
   Some practical examples discussing what generator functions are, how they work, and what they can be used for.
@@ -117,6 +114,14 @@
   http://goshakkk.name/javascript-generators-understanding-sample-use-cases/  
   A simple thinking pattern for easily understanding generators, plus 3 practical applications.
 
+- **My New Favorite ES6 Toy: Destructured Objects as Parameters**  
+  https://css-tricks.com/new-favorite-es6-toy-destructured-objects-parameters/  
+  An example of using objects and destructuring to act like named parameters
+
+- **Extract Nested Data from Arrays and Objects with Destructuring Assignment**  
+  https://angulartoreact.com/es6-destructuring/  
+  Examples of how destructuring can make it easy to create new variables from other data.
+
 
 #### Promises
 

javascript-resources.md

@@ -47,7 +47,7 @@ While this list is primarily focused on learning React and Redux, and generally
 
 
 
-#### Tutorials and Books
+#### Tutorials, Books, and Courses
 
 - **Eloquent Javascript**  
   http://eloquentjavascript.net/  
@@ -57,9 +57,9 @@ While this list is primarily focused on learning React and Redux, and generally
   https://github.com/getify/You-Dont-Know-JS  
   An online book series intended to teach all aspects of Javascript, including the "tougher" parts.
 
-- **Speaking Javascript**  
-  http://speakingjs.com/es5/index.html  
-  A free online book on Javascript from Dr. Axel Rauschmayer.
+- **Exploring Javascript**  
+  http://exploringjs.com/  
+  Multiple free online books from Dr. Axel Rauschmayer.  "Speaking Javascript" covers all of Javascript through ES5; "Exploring ES6" covers ES6 in depth; and other books look at versions of Javascript after ES6 and how to set up an ES6+ development environment.
 
 - **23 Free Javascript Books**  
   https://hackerlists.com/free-javascript-books/  
@@ -84,6 +84,14 @@ While this list is primarily focused on learning React and Redux, and generally
   http://domenlightenment.com/  
   A deep look at how to interact with the DOM from Javascript, without using a library or a framework.
 
+- **Javascript30**  
+  https://javascript30.com/  
+  A free course from Wes Bos that teaches how to build 30 different interesting projects, using only "vanilla" Javascript.
+
+- **Javascript; The Core**  
+  http://dmitrysoshnikov.com/ecmascript/javascript-the-core/  
+  A dive into core concepts of how Javascript objects behave: prototypes, constructors, scopes, closures, and `this`.
+
 
 #### Interactive Exercises
 
@@ -120,6 +128,14 @@ While this list is primarily focused on learning React and Redux, and generally
 - **Understanding Javascript Function Invocation and `this`**  
   http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/  
   An excellent explanation of how function calls and the `this` keyword work
+
+- **When 'not' to use arrow functions**  
+  http://rainsoft.io/when-not-to-use-arrow-functions-in-javascript/  
+  An in-depth look at when you should stick with standard JS functions instead of arrow functions
+
+- **Do ES6 Arrow Functions Really Solve "this" in Javascript?**  
+  https://derickbailey.com/2015/09/28/do-es6-arrow-functions-really-solve-this-in-javascript/  
+  A dive into how `this` works inside of arrow functions, and some places when they may not be appropriate for use.
 
 - **Grokking Scope in Javascript**  
   https://code.tutsplus.com/tutorials/grokking-scope-in-javascript--cms-26259  

mobx-tutorials.md

@@ -37,6 +37,13 @@
 - **Testing React and MobX**  
   https://semaphoreci.com/community/tutorials/how-to-test-react-and-mobx-with-jest  
   A look at ways to test React components and MobX logic
+
+
+#### Other
+
+- **One awkward thing about MobX: Complex Models**  
+  https://swizec.com/blog/awkward-thing-mobx-complex-models/swizec/7260  
+  Discussion of potential issues when handling complex models, and some possible workarounds.
 
 
 #### MobX and Redux Comparisons
@@ -56,4 +63,8 @@ A great video to understand the differences between MobX and Redux.
 
 - **"How does MobX compare with Redux, and which is better for React app development?"**  
   https://hashnode.com/post/how-does-mobx-compare-with-redux-and-which-one-is-better-for-react-app-development-cisrch8eh0030g5532qeds1ja/answer/citq8rptk010cus530wdzdg69  
-  An excellent answer comparing the two libraries and their philosophies
+  An excellent answer comparing the two libraries and their philosophies
+
+- **Redux vs MobX**  
+  https://medium.com/@himrc/redux-vs-mobx-a42c8950f3  
+  Some quick pros and cons of each, links to other discussions, and thoughts on when to use them.

project-structure.md

@@ -2,6 +2,7 @@
 
 
 **Related topics**:
+- [Boilerplates and Starter Kits](./boilerplate-and-starter-kits.md)
 - [React Component Patterns](./react-component-patterns.md)
 - [React State Management](./react-state-management.md)
 - [React and Forms](./react-forms.md)
@@ -18,7 +19,8 @@
 
 - **How to Scale React Applications**  
   https://www.smashingmagazine.com/2016/09/how-to-scale-react-applications/  
-  Max Stoiber, creator of the popular "React-Boilerplate" starter kit, describes the approaches they use to lay out projects based on features.
+  https://twitter.com/dan_abramov/status/773912160896421889  
+  Max Stoiber, creator of the popular "React-Boilerplate" starter kit, describes the approaches they use to lay out projects based on features.  The Twitter thread has discussion on some tradeoffs, including understand that Redux actions are "global", not scoped.
 
 - **Organizing Large React Applications**  
   http://engineering.kapost.com/2016/01/organizing-large-react-applications/  
@@ -63,25 +65,17 @@
 - **How to Structure real world Redux/React Applications**  
   https://medium.com/@yiquanzhou/how-to-structure-real-world-redux-react-application-d61e66a7dd36  
   Another look at structuring code, based on business logic, data domains, and reusability.
-
-
-#### React Integration
-
-- **How to Write a Google Maps React Component**  
-  https://www.fullstackreact.com/articles/how-to-write-a-google-maps-react-component/  
-  Demonstrates how to wrap a third-party component that has an imperative API, lazy-loading the dependencies, and more.
 
-- **Building SVG Maps with React**  
-  https://blog.komand.com/building-svg-maps-with-react  
-  Demonstrates building a component that zooms and pans SVG graphics based on user input.
-
-- **How to Sprinkle ReactJS into an Existing Web Application**  
-  https://scotch.io/tutorials/how-to-sprinkle-reactjs-into-an-existing-web-application  
-  Looks at how to incrementally add some React-based functionality into an existing app.
-
-- **Making custom renderers for React**  
-  http://goshakkk.name/react-custom-renderers/  
-  Describes techniques for building custom rendering components that bridge between normal rendering and something like a canvas
+- **When a good plan comes together: React project structure for scaling**  
+  http://thereactionary.net/when-a-good-plan-comes-together-react-project-structure-for-scaling/  
+  More discussion of tradeoffs in various structure approaches.
+
 
+#### Project Setup
 
-
+- **Setting up a Front-End Project**  
+  https://medium.com/@Torwori/setting-up-a-front-end-project-part-1-d7fbaaaa5e14  
+  https://medium.com/@Torwori/setting-up-a-front-end-project-part-2-cbbae56ffd15  
+  https://medium.com/@Torwori/setting-up-a-front-end-project-part-3-38f1681d310b  
+  https://medium.com/@Torwori/setting-up-a-front-end-project-part-4-b6fe32e58e5  
+  An in-depth tutorial series covering setup and configuration of many tools, including Git, Webpack, Babel, ESLint, and Typescript.

pros-cons-discussion.md

@@ -1,5 +1,9 @@
 ### React/Flux/Redux Pros, Cons, and Discussion
 
+**Related Topics**:
+- [Redux addons catalog - Apps and Examples](https://github.com/markerikson/redux-ecosystem-links/blob/master/apps-and-examples.md): Links to various projects built with Redux, both purpose-built-examples and "real" applications, as well as several Redux usage stories
+- [Redux Architecture and Best Practices](./redux-architecture.md): many "lessons learned"-type articles after having used Redux
+
 
 #### High-Level Comparisons and Business Cases
 
@@ -82,9 +86,10 @@
   Discussion of some of the actual practical advantages of using Redux, with some thoughts on
 similar structures in ClojureScript.
 
-- **"React Tutorial: Cloning Yelp"**
+- **"React Tutorial: Cloning Yelp"**  
+  https://news.ycombinator.com/item?id=11778663  
   https://news.ycombinator.com/item?id=11782234  
-  A great quote on the inherent complexity of developing any application (from yet another "Javascript Fatigue"-type discussion thread
+  Around 250 comments on React, dependency management, tutorial writing, and library churn.  Also a great quote on the inherent complexity of developing any application.
 
 - **"9 things every ReactJS beginner should know"**  
   https://www.reddit.com/r/javascript/comments/42fo3m/9_things_every_reactjs_beginner_should_know/  
@@ -128,10 +133,6 @@ similar structures in ClojureScript.
   https://news.ycombinator.com/item?id=11890229  
   Includes an extended discussion on use of Redux with forms
 
-- **"React Tutorial: Cloning Yelp"**  
-  https://news.ycombinator.com/item?id=11778663  
-  Around 250 comments on React, dependency management, tutorial writing, and library churn.
-
 - **"Why Learning Angular 2 was Excruciating"**  
   https://news.ycombinator.com/item?id=12534296  
   https://news.ycombinator.com/item?id=12536634  
@@ -151,6 +152,11 @@ similar structures in ClojureScript.
   https://www.reddit.com/r/javascript/comments/59ax4f/youtube_is_being_rebuilt_on_web_components_and/d97rsdd/  
   Some interesting thoughts on how various frameworks have approached composition, and how React helps make it more approachable.
 
+- **"Modern JS developer workflow makes me sad"**  
+  https://www.reddit.com/r/javascript/comments/5fphiw/modern_js_developer_workflow_makes_me_sad/  
+  A fairly well-written rant about problems a dev was experiencing due to complexity of build tools.  There's extended discussion with some excellent suggestions and advice, and ultimately the author was able to resolve some of the complaints about build times and sourcemaps.
+
+
 #### React's PATENTS License
 
 - **Facebook Open Source License FAQ**  

react-ajax.md

@@ -34,4 +34,8 @@
 
 - **Handling AJAX In Your React Application with Agility**  
   https://hackernoon.com/handling-ajax-in-your-react-application-with-agility-413f1f21fc70  
-  Describes three approaches to fetching data in a React app: within a React component, using the Relay GraphQL library, and using Redux middleware
+  Describes three approaches to fetching data in a React app: within a React component, using the Relay GraphQL library, and using Redux middleware
+
+- **React-Redux issue #210: "dispatching in componentWillMount?"**  
+  https://github.com/reactjs/react-redux/issues/210#issuecomment-244774674  
+  Some valuable extended discussion about how managing requests and data really involves several distinct possible states.

react-architecture.md

@@ -75,6 +75,14 @@
   https://medium.com/javascript-inside/some-thoughts-on-function-components-in-react-cb2938686bc7  
   Suggestions for ways to approach writing components, particularly using React's functional component syntax
 
+- **Why React is Awesome at Scale**  
+  https://medium.com/@cowi4030/why-react-is-awesome-at-scale-acfd9ce53c23  
+  Examples of how React's use of declarative rendering simplifies the need to think about imperative state transitions.
+
+- **"What are the biggest 'aha' moments you had while learning React?"**  
+  https://www.reddit.com/r/reactjs/comments/5gmywc/what_were_the_biggest_aha_moments_you_had_while/  
+  Some great discussion of important concepts and things to understand about React.
+
 
 #### React Best Practices
 
@@ -141,4 +149,8 @@
 
 - **Writing a good React Component**  
   https://medium.com/thoughts-from-travelperk/writing-a-good-react-component-59624ed40b8e  
-  Some very good best practices for writing components.
+  Some very good best practices for writing components.
+
+- **The Top 5 [Tips] of Effective React**  
+  https://code.kiwi.com/the-top-5-of-effective-react-984e54cceac3  
+  Tips include using container/presentational components, keeping components simple, and more.

react-component-patterns.md

@@ -192,6 +192,37 @@
   https://www.okgrow.com/posts/compose-react-sphoc  
   Thoughts and examples of composing multiple small focused HOCs together into a final combined HOC
 
+
+#### Wrapping Non-React Code
+
+- **React and third-party libraries**  
+  http://krasimirtsonev.com/blog/article/react-third-party-library-integration  
+  Demonstrates how to build a React component that wraps up non-React code like a jQuery UI plugin
+
+- **Using React and jQuery Together**  
+  http://tech.oyster.com/using-react-and-jquery-together/  
+  Examples of how to use jQuery inside a React component, and React inside jQuery-controlled elements
+
+- **Using React and PixiJS**  
+  http://www.rinconstrategies.io/using-react-and-pixijs.html  
+  Demonstrates how to use React's component lifecycle methods to control the imperative PixiJS API
+
+- **Mapping declarative React components to imperative external APIs**  
+  http://reactkungfu.com/2016/02/mapping-declarative-react-components-to-imperative-external-api/  
+  A quick example of using `componentWillReceiveProps` to pass updates to an imperative API
+
+- **How to Write a Google Maps React Component**  
+  https://www.fullstackreact.com/articles/how-to-write-a-google-maps-react-component/  
+  Demonstrates how to wrap a third-party component that has an imperative API, lazy-loading the dependencies, and more.
+
+- **Building SVG Maps with React**  
+  https://blog.komand.com/building-svg-maps-with-react  
+  Demonstrates building a component that zooms and pans SVG graphics based on user input.
+
+- **How to Sprinkle ReactJS into an Existing Web Application**  
+  https://scotch.io/tutorials/how-to-sprinkle-reactjs-into-an-existing-web-application  
+  Looks at how to incrementally add some React-based functionality into an existing app, including interaction with jQuery.
+
 
 #### Other Component Patterns
 
@@ -222,7 +253,15 @@
 - **"What is the ideal way to pass data to a callback prop?**  
   https://gist.github.com/jazlalli/fdee443405680f96d19211daa15d1d38  
   Discussion and examples of various ways to pass data to callbacks between children and parents
-
-- **React and third-party libraries**  
-  http://krasimirtsonev.com/blog/article/react-third-party-library-integration  
-  Demonstrates how to build a React component that wraps up non-React code like a jQuery UI plugin
+
+- **How to Render Components Outside the Main React App**  
+  https://blog.komand.com/how-to-render-components-outside-the-main-react-app  
+  An example of a technique that's also know as the "portal" approach, commonly used for rendering modals on top of the rest of an application. 
+
+- **Modals in React**  
+  https://medium.com/@david.gilbertson/modals-in-react-f6c3ff9f4701  
+  A demonstration of building a reusable modal component using the "portals" technique
+
+- **On Privacy with React Context**  
+  https://medium.com/@amireh/on-privacy-with-react-context-aa77ffd08509  
+  Thoughts on some potential issues with various component/state patterns (globals, Redux, Flux, Ember), and a sketch of a notional approach that might help solve some of those issues.

react-forms.md

@@ -110,4 +110,8 @@
 
 - **Creating new fields and widgets for Mozilla's react-jsonschema-form**  
   https://jeffersonheard.github.io/2016/11/creating-new-fields-and-widgets-for-mozillas-react-jsonschema-form/  
-  Examples of working with the react-jsonschema-form library, including defining form schemas, gotchas, and customization with specific widgets and types
+  Examples of working with the react-jsonschema-form library, including defining form schemas, gotchas, and customization with specific widgets and types
+
+- **List or Form, why not both? Making a list with a built in editor in React**  
+  http://thereactionary.net/list-or-form-why-not-both-making-a-list-with-a-built-in-editor-in-react/  
+  Builds an example of a list with the ability to do inline editing of items.

react-implementation.md

@@ -94,6 +94,10 @@
   https://www.youtube.com/watch?v=VVxQAoNK_XQ  
   A talk exploring how a React renderer works, and how to implement a tiny renderer
 
+- **Making custom renderers for React**  
+  http://goshakkk.name/react-custom-renderers/  
+  Describes techniques for building custom rendering components that bridge between normal rendering and something like a canvas
+
 
 #### React Fiber