happypoulp/redux-tutorial

Don't use decorators

Closed this issue · 5 comments

Decorators are experimental feature.

From home.jsx:

React-Redux is exposing a decorator (an ES7 feature...

This is incorrect. connect() is just a function. You don't need decorators or ES7 to use connect(). connect() is just a function that takes some configuration and your component, and returns another component that renders yours with data from Redux store.

Now, technically you can use decorators to apply connect(). So instead of writing

class App extends Component {}
App = connect(
  mapStateToProps
)(App);

you can write, given you enabled decorator support,

@connect(mapStateToProps)
class App extends Component {}

But this absolutely doesn't mean connect() must be used with decorator syntax. In fact we advise against it because the spec is experimental, and experimental features are subject to change and breakage. For example Babel 6 doesn't even ship decorator support (spec is still changing), and this caused a lot of frustration for people who relied on them.

Please don't rely on decorators if you're a beginner or teaching beginners, and don't explain connect() as a decorator because first and foremost, it's a function that takes a component and returns a component. We often call these higher order components.

Higher order component = a pattern. Decorator = syntax sugar that can be used to apply this pattern, and that we don't recommend unless the person using them absolutely knows what they're doing.

Hi,

Thanks for the details. I agree that the formulation is misleading, I just thought it would be easier to understand if presented like that. Many resources about redux / react-redux were using decorators at the time of writing of this tutorial and I wanted to stick with the most mainstream approach but I see now that the official react-redux docs tells very little about it...
I'll update tutorial to speak only about HOC pattern with a small side-note on decorators.

Thanks! Maybe just separating them into a "bonus" chapter could work. Unfortunately there's too much churn with their support in Babel right now.

iddan commented

Can we discuss this subject again as the decorators syntax is coming back to Babel and in stage-3?
I think it would be a shame the syntax will become official and yet the first result in Google will be: Don't use decorators

Let's wait for results on babel/babel#2645?

iddan commented

Sure thing, just wanted to raise your attention. BTW: I ❤️ your work @gaearon.