👨‍💻
Community Resources
  • Welcome!!
  • Blockchain Resources
  • Web Development
  • A to Z Resources
  • Best GitHub Repos
  • MEAN & MERN Stack
  • React, Redux and ES6
    • basic-concepts
    • boilerplates-and-starter-kits
    • community-resources
    • es6-features
    • flux-tutorials
    • functional-programming
    • git-resources
    • immutable-data
    • javascript-resources
    • node-js-and-npm
    • pros-cons-discussion
    • react-performance
    • react-redux-architecture
    • react-redux-testing
    • react-styling
    • react-tutorials
    • react-vs-backbone
    • redux-side-effects
    • redux-techniques
    • redux-tutorials
    • thinking-in-react-and-flux
    • tips-and-best-practices
    • using-react-with-es6
    • webpack-advanced-techniques
    • webpack-tutorials
  • NodeJS
  • React Native
  • Mixed PDFs
  • AI/ML/DL
Powered by GitBook
On this page
  • React Component Definitions
  • Methods and Instance Binding
  • Method Binding Utilities

Was this helpful?

  1. React, Redux and ES6

using-react-with-es6

Previoustips-and-best-practicesNextwebpack-advanced-techniques

Last updated 4 years ago

Was this helpful?

React Component Definitions

  • Which React Component Class Syntax Should I Use? Compares the standard React.createClass() syntax vs ES6 React.Component class syntax

  • Coding with React like a Game Developer Demonstrates React usage with ES5 vs ES6, plus some other topics

  • The React Quick Start Guide: ES6 Edition An ES6 version of the other guide listed earlier

  • Digging Into React: Choosing Component Styles A comparison of the three ways to define a React component. Good descriptions, and links to some other related discussions.

  • Refactoring React Components to ES6 Classes Walks through the steps needed to convert an older-style React.createClass() component to use the newer ES6 class syntax instead.

Methods and Instance Binding

  • React and ES6 - Binding Approaches Various methods of binding "this" in React ES6 classes

  • Why and How to Bind Methods in your React Component Classes A good look at function binding in JS, and how it works with React

  • React, ES6, Autobinding, and createClass() A useful review of how JS function binding works, and how to handle it in ES6 with React

Method Binding Utilities

  • React-Autobind A useful utility to bind class methods. A good compromise - makes binding explicit, but removes repetition.

  • react-bind-decorator Another autobinding approach, intended to be fast and performant.

  • react-class-binder Automatically bind methods defined in a React component using the ES2015 class syntax (similar to how React.createClass works). The Reddit comments have discussion on some differences between the various libs that implement autobinding.

http://reactkungfu.com/2015/07/what-react-component-class-syntax-should-i-use/
https://medium.com/@PhilPlckthun/coding-with-react-like-a-game-developer-e39ffaed1643
http://www.jackcallister.com/2015/08/30/the-react-quick-start-guide-es6-edition.html
http://benmccormick.org/2016/05/02/digging-into-react-choosing-component-styles/
http://www.newmediacampaigns.com/blog/refactoring-react-components-to-es6-classes
http://egorsmirnov.me/2015/08/16/react-and-es6-part3.html
http://reactkungfu.com/2015/07/why-and-how-to-bind-methods-in-your-react-component-classes/
http://blog.andrewray.me/react-es6-autobinding-and-createclass/
https://github.com/cassiozen/React-autobind
https://github.com/zackargyle/react-bind-decorator
https://github.com/Klathmon/react-class-binder
https://www.reddit.com/r/reactjs/comments/4p0ytu/i_made_a_small_package_to_easily_autobind_this_in/