React, Redux and ES6

✨This repo serves as a resource for developers to leverage on their journey into React, Redux, ECMA 6 and lot more.✨

Curated tutorial and resource links I've collected on React, Redux, ES6, and more, meant to be a collection of high-quality articles and resources for someone who wants to learn about the React-Redux ecosystem. Not quite "awesome", but hopefully useful as a starting point I can give to others. Suggestions welcome.

Table of Contents

Getting Started

• Basic Concepts and Overviews

• Community Resources

• Javascript Resources

• Git Resources and Tutorials

• Node.js and NPM

• Webpack Tutorials

• Boilerplates and Starter Kits

Basic Tutorials

• ES6 Features and Samples

• React Tutorials

• Flux Tutorials

• Redux Tutorials

Intermediate Concepts

• Using React with ES6

• Functional Programming

• Immutable Data

• React/Redux Testing

Advanced Topics

• React Performance

• React/Redux Architecture

• React Styling

• Redux Side Effects

• Redux Tips and Techniques

• Webpack Advanced Techniques

Guidelines, Comparisons, and Discussion

• Thinking in React and Flux

• Tips, Guidelines, and Best Practices

• React/Flux/Redux Pros, Cons, and Discussion

• React and Flux vs Backbone

Best of the Best / Suggested Reading List

All of the links in this collection are worth reading, but there's obviously a LOT of them. Here's a "best-of" list to get you started:

• React How-To https://github.com/petehunt/react-howto Pete Hunt, one of React's creators, gives a high-level suggested order to use when learning React-related technologies (React, NPM, bundlers, ES6, routing, and Flux/Redux)

• ES6 - The Bits You'll Actually Use http://jamesknelson.com/es6-the-bits-youll-actually-use/ A quick tour through some of the more useful features in ES6

• ES6 Features Comparison http://es6-features.org/ Code snippets comparing ES6 features with their ES5 equivalents

• Webpack - The Module Bundler http://alp82.github.io/webpack-experiment-slides/#/ HTML slideshow that describes Webpack's features and links to demos

• React to the Future http://elijahmanor.com/talks/react-to-the-future/dist/#/ A fantastic HTML slideshow describing what React is, what makes it special, and how to work with it

• Relieving Backbone Pain with Flux & React http://product.hubspot.com/blog/moving-backbone-to-flux-react A fantastic video that walks through common problems with using Backbone, and how React can help solve those

• Components, React, and Flux http://slides.com/danabramov/components-react-flux-wip#/ 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 http://banderson.github.io/reactive-component-ui-presentation/#/ 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)

• Redux Docs http://redux.js.org/index.html The official Redux documentation. FANTASTIC writing - not just "here's the API", but "here's what you want to do and how we came up with this"

• Managing Data Flow on the Client Side http://blog.madewithlove.be/post/redux/ Walks through a small Redux example, and talks about the benefits

• Pros and Cons of Using Immutability With React http://reactkungfu.com/2015/08/pros-and-cons-of-using-immutability-with-react-js/ Excellent description of what immutability is, how to use it with React, and pros and cons of using it

• React Best Practices and Tips http://www.toptal.com/react/tips-and-practices Several excellent guidelines for component structure and behavior

• Redux Best Practices https://medium.com/lexical-labs-engineering/redux-best-practices-64d59775802e Guidelines for tools, component structure, file layout, and async data handling