From cf947ccee619d7c9ecc38fc2216b6cf9cff7dab4 Mon Sep 17 00:00:00 2001 From: Mark Erikson Date: Sun, 30 Apr 2017 15:01:33 -0400 Subject: [PATCH] Updates, 2017-04-30 --- basic-concepts.md | 6 +++++- react-architecture.md | 8 ++++++++ react-component-patterns.md | 4 ++++ react-performance.md | 4 ++++ react-routing.md | 6 +++++- redux-architecture.md | 6 +++++- redux-techniques.md | 8 ++++---- redux-tutorials.md | 4 ++++ redux-without-react.md | 6 +++++- 9 files changed, 44 insertions(+), 8 deletions(-) diff --git a/basic-concepts.md b/basic-concepts.md index 96b16d8..90c08a3 100644 --- a/basic-concepts.md +++ b/basic-concepts.md @@ -133,4 +133,8 @@ - **How to Manage Javascript Fatigue** https://auth0.com/blog/how-to-manage-javascript-fatigue/ - A description of what "JS fatigue" means in practice, and advice for managing it, including "picking battles", "make something interesting", and "be aware of common concepts". \ No newline at end of file + A description of what "JS fatigue" means in practice, and advice for managing it, including "picking battles", "make something interesting", and "be aware of common concepts". + +- **Javascript is a buffet, not the enemy** + https://scriptconf.org/blog/javascript-is-a-buffet-not-the-enemy-chris-heilmann/ + An excellent presentation from long-time browser developer Chris Heilmann, offering suggestions for dealing with the modern Javascript world using a buffet as a metaphor. \ No newline at end of file diff --git a/react-architecture.md b/react-architecture.md index c5cd183..c4851fa 100644 --- a/react-architecture.md +++ b/react-architecture.md @@ -204,6 +204,14 @@ https://hackernoon.com/10-react-mini-patterns-c1da92f068c5 A collection of simple but useful patterns for writing React code, from basic top-down data flow via props to formatting text for display. +- **8 Tips for Dealing with Large React Codebases** + https://medium.com/@l_e/8-tips-for-dealing-with-large-react-codebases-aed6235500a4 + Several useful suggestions, including using guard clauses when rendering, writing descriptive component names, simplifying form change handlers, and more. + +- **How to Organize a Large React Application and Make It Scale** + https://www.sitepoint.com/organize-large-react-application/ + A number of practical suggestions for managing large codebases, including build config to simplify imports, folder structures, file naming, Redux, tests, and more. + #### React Architecture diff --git a/react-component-patterns.md b/react-component-patterns.md index ac4ae9b..4ee3a93 100644 --- a/react-component-patterns.md +++ b/react-component-patterns.md @@ -323,6 +323,10 @@ https://medium.com/@adamrackis/simplifying-life-with-react-render-callbacks-cb37d58e55 An overview of several different ways to wrap up components, including cloning children, HOCs, and render callbacks. +- **Why you should keep your React components pure by using HOCs** + https://medium.com/@DjamelH/why-you-should-keep-your-react-components-pure-by-using-hocs-67e5c7f80c81 + Walks through extracting stateful behavior into an HOC so that it's more reusable and the wrapped components are simpler. + #### Wrapping Non-React Code diff --git a/react-performance.md b/react-performance.md index c7f4597..e421a48 100644 --- a/react-performance.md +++ b/react-performance.md @@ -198,6 +198,10 @@ Also see [Webpack Advanced Techniques](./webpack-advanced-techniques.md) https://twitter.com/acemarke/status/806933658204372992 An excellent article that describes how Immutable.js's implementation can improve performance while updating large objects, with benchmarks. There's further good discussion on Reddit, and in the Twitter thread, Immutable.js author Lee Byron confirms that calling `toJS()` is _very_ expensive and should definitely not be used in a Redux `mapState` function. +- **Should I use Immutable.js with Redux?** + https://medium.com/@fastphrase/should-i-use-immutablejs-with-redux-58f88d6fd81e + A well-written comparison of several pros and cons for using Immutable.js, including perf benefits, perf negatives, enforced immutability, and overhead of use. + #### Redux Performance diff --git a/react-routing.md b/react-routing.md index 8980cce..31d1a5e 100644 --- a/react-routing.md +++ b/react-routing.md @@ -59,4 +59,8 @@ - **Dealing with Authentication in React** https://medium.com/@nesbtesh/dealing-with-authentication-in-react-cadb679fbc0f - Some short examples of saving an authentication token, writing queries to use and update that token, and checking the token when rendering components. \ No newline at end of file + Some short examples of saving an authentication token, writing queries to use and update that token, and checking the token when rendering components. + +- **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. \ No newline at end of file diff --git a/redux-architecture.md b/redux-architecture.md index 76ea7db..805e936 100644 --- a/redux-architecture.md +++ b/redux-architecture.md @@ -321,4 +321,8 @@ - **Ducks++: Redux Reducer Bundles** https://medium.com/@DjamelH/ducks-redux-reducer-bundles-44267f080d22 - Describes an enhancement to the original "ducks" proposal, adding a string constant to help define where the state is kept in the store. \ No newline at end of file + Describes an enhancement to the original "ducks" proposal, adding a string constant to help define where the state is kept in the store. + +- **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. \ No newline at end of file diff --git a/redux-techniques.md b/redux-techniques.md index 792d260..f0dcf14 100644 --- a/redux-techniques.md +++ b/redux-techniques.md @@ -252,10 +252,6 @@ http://engineering.tes.com/post/secure-file-uploads/ Some examples of how to use Redux-Plupload to manage file uploads -- **Redux: Perils of Time** - http://redux-perils-of-time.surge.sh/#/?presenter - A slideshow with some intriguing thoughts on how to manage offline experiences, cached data, and optimistic UI in a Redux app. - - **{Persist}ence is Key: Using Redux-Persist to Store Your State in LocalStorage** https://medium.com/@clrksanford/persist-ence-is-key-using-redux-persist-to-store-your-state-in-localstorage-ac6a000aee63 A quick introduction to using redux-persist to reuse store state between page refreshes @@ -291,6 +287,10 @@ https://medium.com/@prescottprue/firebase-with-redux-82d04f8675b9 Examples for combining Firebase into a Redux application +- **Redux: Perils of Time** + http://redux-perils-of-time.surge.sh/#/?presenter + A slideshow with some intriguing thoughts on how to manage offline experiences, cached data, and optimistic UI in a Redux app. + - **Introducing Redux Offline: Offline-First Architecture for Progresive Web Applications** https://hackernoon.com/introducing-redux-offline-offline-first-architecture-for-progressive-web-applications-and-react-68c5167ecfe0 An excellent blog post explaining the need for better offline behavior in web apps, and introducing a new Redux-based library that helps manage that behavior. diff --git a/redux-tutorials.md b/redux-tutorials.md index 0b3ee5c..bb5258c 100644 --- a/redux-tutorials.md +++ b/redux-tutorials.md @@ -232,6 +232,10 @@ https://gist.github.com/gaearon/1d19088790e70ac32ea636c025ba424e A very simplified version of React Redux's `connect()` function that illustrates the basic implementation +- **Build Yourself a Redux** + https://zapier.com/engineering/how-to-build-redux/ + An excellent in-depth "build a mini-Redux" article, which covers not only Redux's core, but also `connect` and middleware as well. + - **Let's Write Redux!** http://www.jamasoftware.com/blog/lets-write-redux/ Walks through writing a miniature version of Redux step-by-step, to help explain the concepts and implementation. diff --git a/redux-without-react.md b/redux-without-react.md index 02b9949..9c2a31b 100644 --- a/redux-without-react.md +++ b/redux-without-react.md @@ -56,4 +56,8 @@ - **Explorations in Adapting Redux to C#** https://spin.atomicobject.com/2017/03/13/adapting-redux-c-sharp-xamarin/ - An informative look at how AtomicObject has a Redux variant in C# \ No newline at end of file + An informative look at how AtomicObject has a Redux variant in C# + +- **Something Useless - Redux Implemented in Elixir** + http://hostiledeveloper.com/2017/04/18/something-useless-redux-implemented-in-elixir.html + An Elixir developor walks through implementing Redux in Elixir \ No newline at end of file