> For the complete documentation index, see [llms.txt](https://yashsharma.gitbook.io/community-resources/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://yashsharma.gitbook.io/community-resources/untitled/thinking-in-react-and-flux.md).

# thinking-in-react-and-flux

* **Thinking in React**  

  <https://facebook.github.io/react/docs/thinking-in-react.html> &#x20;

  The original guide to breaking a UI into components and setting up data flow
* **Removing User Interface Complexity, or Why React is Awesome** &#x20;

  <http://jlongster.com/Removing-User-Interface-Complexity,-or-Why-React-is-Awesome> &#x20;

  A long walkthrough that builds up a pseudo-React-like library, demonstrating what React does and why you would want to use it. Has lots of embedded demos.
* **Describing UI State with Data** &#x20;

  <http://nicolashery.com/describing-ui-state-with-data/> &#x20;

  Demonstrates modeling the state and actions of an application, and updating the UI based on that.
* **Common React Mistakes - Unneeded State** &#x20;

  <http://reactkungfu.com/2015/09/common-react-dot-js-mistakes-unneeded-state/> &#x20;

  Examples of how to think about and model data and UI state
* **Understanding the Functional Revolution in Front-End Applications** &#x20;

  <http://blog.reactandbethankful.com/posts/2015/09/15/understanding-the-functional-revolution/> &#x20;

  Higher-level tutorial describing functional programming and how it relates to Javascript, UI, and client-side applications
* **Functional UI and Components as Higher Order Functions** &#x20;

  <https://blog.risingstack.com/functional-ui-and-components-as-higher-order-functions/> &#x20;

  Another tutorial on functional programming and how it relates to React
* **Components, React, and Flux** &#x20;

  <http://slides.com/danabramov/components-react-flux-wip#/> &#x20;

  A fantastic HTML slideshow that discusses how to organize code as reusable components, and the basic concepts and benefits of a Flux unidirectional architecture
* **Reactive, Component-Based UIs** &#x20;

  <http://banderson.github.io/reactive-component-ui-presentation/#/> &#x20;

  Another fantastic HTML slideshow describing the three principles of React: "functional over OOP", "stateless over stateful", "clarity over brevity" (use arrow keys to advance slides)
* **Why You Should Care About Flux**\
  <http://jaysoo.ca/2015/06/02/why-you-should-care-about-flux/>\
  Describes the value in separating "reads" from "writes", and eliminating local state
* **Lessons Backbone Developers Can Learn From React**\
  <http://benmccormick.org/2015/09/09/what-can-backbone-developers-learn-from-react/>\
  Discusses 3 lessons from React: "UIs are trees of reusable components", "modern JS is cleaner code", and "don't use DOM for state"
* **State is an Anti-Pattern**\
  <https://www.reddit.com/r/reactjs/comments/3bjdoe/state_is_an_antipattern/>\
  Some long-winded but useful thoughts on what makes a good component: "intuitive", "same input -> same output", "pure", and "only side effects are Flux actions"
* **Why Local Component State is a Trap**\
  <https://www.safaribooksonline.com/blog/2015/10/29/react-local-component-state/>\
  Thoughts on a "single state tree" vs local component state
* **Functional Javascript: Reverse-Engineering the Hype**\
  <http://banderson.github.io/functional-js-reverse-engineering-the-hype/#/>\
  A slideshow that talks about why functional-type programming matters, and how it relates to React-type apps.
* **"Trying to understand why React prefers one-way data binding"**\
  <https://www.reddit.com/r/javascript/comments/4ni311/trying_to_understand_why_react_prefers_oneway/>\
  Some excellent and very informative discussion on why the "one-way data flow" paradigm is used with React, vs two-way data binding.