Updates, 2017-06-14

community-resources.md

@@ -55,6 +55,10 @@
   https://www.planet-react.org/  
   A blog aggregator that collects posts from dozens of blogs written by members of the React community.  An excellent resource.
 
+- **Awesome CSS-in-JS**  
+  https://github.com/tuchk4/awesome-css-in-js  
+  A collection of awesome things regarding  CSS in JS approaches
+
 
 #### People
 

es6-features.md

@@ -60,6 +60,10 @@
   https://github.com/zsolt-nagy/es6-summary  
   A list of ES6 features and their ES5 equivalents
 
+- **Introduction to commonly used ES6 features**  
+  https://zellwk.com/blog/es6/  
+  A great look at how several of the most useful ES6 features work, such as block scoping, arrow functions, and destructuring.
+
 
 #### In-Depth Details
 

functional-programming.md

@@ -145,4 +145,12 @@
 
 - **Higher-order functions in Lodash**  
   http://pragmatists.pl/blog/2017/05/higher-order-functions-in-lodash/  
-  An explanation of several FP concepts like partial application and currying, and how Lodash offers utility functions to help make use of those concepts.
+  An explanation of several FP concepts like partial application and currying, and how Lodash offers utility functions to help make use of those concepts.
+
+- **How to Draw an Owl**  
+  https://glebbahmutov.com/blog/how-to-draw-an-owl/  
+  Demonstrates refactoring some complex imperative code into a functional approach that uses concepts like pure functions, lenses, immutable data, and the Maybe monad
+
+- **Classes, Complexity, and Functional Programming**  
+  https://medium.com/@kentcdodds/classes-complexity-and-functional-programming-a8dd86903747  
+  Kent C Dodds looks at pros and cons of using classes, issues with the `this` keyword in Javascript, and some ways to avoid using classes

pros-cons-discussion.md

@@ -82,6 +82,10 @@
   https://news.realm.io/news/the-post-mvc-age/  
   A conference talk (video and transcription) that discusses how building apps with components works, how to communicate between them, and how Flux/Redux and Reactive Programming differ from traditional MVC, 
 
+- **Redux is the Pivotal Frontend Innovation**  
+  https://medium.com/@maxlynch/redux-is-the-pivotal-frontend-innovation-a406736552cb  
+  An opinionated article that says state management is even more important than components.
+
 
 #### Comment Threads and Discussions
 

react-architecture.md

@@ -102,6 +102,10 @@
 - **"Thinking in React" - A paradox statement**  
   https://medium.com/@nimelrian/thinking-in-react-a-paradox-statement-33c19e2eb9e2  
   Some thoughts on the recent "Flux architecture hampered React innovation" Twitter discussion, including a list of three principles for React components, and tradeoffs of data flow handling.
+
+- **Thinking in React**  
+  https://www.codementor.io/radubrehar/thinking-in-react-8duata34n  
+  Some quick thoughts on how React's rendering approach can be applied universally, how it simplifies dealing with state transitions, and how its API helps devs build UIs naturally.
 
 
 #### React Best Practices

react-forms.md

@@ -61,6 +61,10 @@
 - **React Forms: Using Refs**  
   https://css-tricks.com/react-forms-using-refs/  
   A quick recap of what "controlled components" are, and some excellent examples of how to use refs to directly access values for different types of inputs in forms
+
+- **Understanding your options with forms in React**  
+  https://medium.com/@thegreengreek/understanding-your-options-with-forms-in-react-afedc91ebf3e  
+  A quick summary of the three major forms approachs (controlled inputs, uncontrolled inputs + refs, uncontrolled inputs + serialization), with code examples for each
 
 
 #### Form Tutorials and Usage

react-redux-testing.md

@@ -202,6 +202,10 @@
 - **Test Your Redux Container with Enzyme**  
   https://medium.com/@visualskyrim/test-your-redux-container-with-enzyme-a0e10c0574ec  
   Examples for using Enzyme to test Redux-connected components, including passing in a mock store, use of shallow rendering, and testing `mapDispatch`.
+
+- **Redux Testing Step by Step: A simple Methodology for Testing Business Logic**  
+  https://hackernoon.com/redux-testing-step-by-step-a-simple-methodology-for-testing-business-logic-8901670756ce  
+  An excellent article by Tal Kol, describing how different types of tests fit together, the different kinds of Redux code that need to be tested, and how to write tests for each.
 
 
 

react-routing.md

@@ -63,4 +63,8 @@
 
 - **Role based routing with React and Redux**  
   http://crazysigma.com/blogs/2017/04/16/role-based-routing-react-redux/  
-  A description of a fairly simple approach for defining role-based handling of routes, with sample code.
+  A description of a fairly simple approach for defining role-based handling of routes, with sample code.
+
+- **Preact Authentication Tutorial**  
+  https://auth0.com/blog/preact-authentication-tutorial/  
+  A tutorial that demonstrates how to build an app with Preact, including authentication, and makes some comparisons to doing so in React.

react-server-rendering.md

@@ -31,4 +31,12 @@
 
 - **Going Isomorphic with Python and React**  
   https://dev.to/__amol__/going-isomorphic-with-python-and-react  
-  A look at how to use DukPy and React together to write an isomorphic web application with Python without even installing Node.js.
+  A look at how to use DukPy and React together to write an isomorphic web application with Python without even installing Node.js.
+
+- **Server side rendering with React, React Router v4, React Helmet, and CSS Modules**  
+  https://blog.digitalkwarts.com/server-side-rendering-with-reactjs-react-router-v4-react-helmet-and-css-modules/  
+  A detailed tutorial demonstrating how to set up a production-ready SSR application
+
+- **Code Cracked for Code Splitting + SSR in Reactlandia: React Loadable + Webpack Flush Chunks**  
+  https://hackernoon.com/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8  
+  Describes some of the problems involved in properly implementing both SSR and code-splitting, and how a combination of libraries seems to help solve those problems.

redux-architecture.md

@@ -103,6 +103,10 @@
   https://www.mapbox.com/blog/redux-for-state-management-in-large-web-apps/  
   Excellent discussion and examples of idiomatic Redux architecture, and how Mapbox applies those approaches to their Mapbox Studio application.
 
+- **Reducing our Redux Code with React Apollo**  
+  https://dev-blog.apollodata.com/reducing-our-redux-code-with-react-apollo-5091b9de9c2a  
+  Peggy Rayzis from MLS shares a detailed look at how they used the React Apollo library and GraphQL to drastically simplify their Redux application
+
 
 #### Redux Best Practices
 
@@ -212,6 +216,18 @@
 - **Is using a mix of Redux state and React local component state ok?**  
   http://blog.jakoblind.no/2017/02/08/is-using-a-mix-of-redux-state-and-react-local-component-state-ok/  
   A short article expanding on the rules of thumb for when to use Redux state given in the Redux FAQ, with some examples for each rule of thumb.
+
+- **Five Tips for Working with Redux in Large Applications**  
+  https://medium.com/appnexus-tech/five-tips-for-working-with-redux-in-large-applications-89452af4fdcb  
+  Useful suggestions for architecting Redux apps, include use of indices / lookup tables, separation of state, and reuse of common reducer logic.
+
+- **React State vs Redux State: When and Why?**  
+  https://spin.atomicobject.com/2017/06/07/react-state-vs-redux-state/  
+  Some helpful suggestions on how to categorize state into short/medium/long-term, and how to decide where that state should live
+
+- **React Native, Redux, and Firebase for experts, by dummies**  
+  https://medium.com/rumors/react-native-redux-and-firebase-for-experts-by-dummies-6376becdd5c8  
+  The Rumors team describes how they've structured their Redux+Firebase application, and some of the things they ran into
 
 
 #### Encapsulation and Reusability
@@ -350,4 +366,8 @@
 
 - **Isomorphic Redux**  
   https://medium.com/@ellisande_poet/isomorphic-redux-fdaadea13bb5  
-  Walks through an implementation of keeping two Redux stores in sync via distributed actions over websockets.
+  Walks through an implementation of keeping two Redux stores in sync via distributed actions over websockets.
+
+- **Introducing FilterBubbler: A WebExtension built using React/Redux**  
+  https://hacks.mozilla.org/2017/06/introducing-filterbubbler-a-webextension-built-using-reactredux/  
+  Describes how the authors built a browser WebExtension that uses the Redux-WebExt bridge as part of the implementation.

redux-side-effects.md

@@ -177,7 +177,8 @@
 - **Javascript Power Tools: Redux-Saga**  
   http://formidable.com/blog/2017/javascript-power-tools-redux-saga/  
   http://formidable.com/blog/2017/composition-patterns-in-redux-saga/  
-  A fantastic series that the concepts, implementation, and benefits behind Redux-Saga, including how ES6 generators are used to control function flow, and how sagas can be composed together to accomplish concurrency.
+  http://formidable.com/blog/2017/real-world-redux-saga-patterns/  
+  A fantastic series that the concepts, implementation, and benefits behind Redux-Saga, including how ES6 generators are used to control function flow, how sagas can be composed together to accomplish concurrency, and practical use cases for sagas.
 
 - **Managing Side Effects with Redux Saga: A Primer**  
   https://www.sigient.com/blog/managing-side-effects-with-redux-saga-a-primer-1  
@@ -187,6 +188,15 @@
   https://medium.com/onfido-tech/exploring-redux-sagas-cc1fca2015ee  
   An excellent article that explores how to use sagas to provide a glue layer to implement decoupled business logic in a Redux application.
 
+- **Redux-Saga: put() from inside a callback / File Upload Progress**  
+  https://decembersoft.com/posts/redux-saga-put-from-inside-a-callback/  
+  https://decembersoft.com/posts/file-upload-progress-with-redux-saga/  
+  A pair of posts demonstrating how to use Redux-Saga's "event channel" feature to interact with non-Redux code
+
+- **Effects as Data**  
+  https://gist.github.com/iammerrick/fc4a677cea11d9c896e8d3a29a184f91  
+  A small essay on the benefits of treating effects as data, and how it enables decoupling
+
 
 #### Other Side Effect Approaches
 

redux-techniques.md

@@ -168,6 +168,10 @@
 - **React, Reselect, and Redux**  
   https://medium.com/@parkerdan/react-reselect-and-redux-b34017f8194c  
   An explanation of how Reselect's memoized selector functions are useful in Redux apps, and how to create unique selector instances for each component instance.
+
+- **Use Selectors in Redux for Great Good**  
+  https://medium.com/@TomasEhrlich/use-selectors-in-redux-for-great-good-59286ce2e2a1  
+  A short article explaining the importance of selectors, with a few examples of how they benefit applications and how to use them.
 
 
 #### UI and Widget Implementations

static-typing.md

@@ -156,6 +156,10 @@
 - **React & Redux in TypeScript - Static Typing Guide**  
   https://github.com/piotrwitek/react-redux-typescript-guide  
   A comprehensive guide to static typing "React & Redux" apps using TypeScript
+
+- **Porting a React and Redux Application to TypeScript**  
+  https://bytesized.xyz/react-redux-typescript/  
+  Demonstrates porting an existing React+Redux sample app to use TypeScript
 
 
 #### Advancing Typing Techniques

webpack-advanced-techniques.md

@@ -188,6 +188,10 @@
   http://blog.jakoblind.no/2017/05/18/3-ways-to-reduce-webpack-bundle-size/  
   A quick summary of some possible approaches to optimize bundle sizes, with links to more information
 
+- **Introducing Bonsai: an open source Webpack analyzer**  
+  https://medium.com/@Pinterest_Engineering/introducing-bonsai-an-open-source-webpack-analyzer-6bdfe22f8984  
+  The Pinterest team describes the problems they'd encountered optimizing their Webpack bundles, and introduces a new tool to help analyze bundles and dependency trees.
+
 
 #### Hot Module Replacement