3 ms·

Classes made it easier [for me anyway] to understand how react is setup. I understand Component is a prototype, and it gets instantiated first by calling the co

Classes made it easier [for me anyway] to understand how react is setup. I understand Component is a prototype, and it gets instantiated first by calling the constructor method - followed by its life cycle methods, like componentDidMount etc. The new hooks API just looks to replicate alot of these methods to make up for losing classes and its life cycle methods. The API seems quite terse. I dont like having lots of nested functions, it makes readability worse IMHO I also dont like the idea of 'useState' overwriting the whole state object.

sjogress 7y ago
I'm enjoying hooks so far, but I think I understand where you are coming from. The thing I enjoy with hooks is that you no longer have to juggle state/async in different methods. I'd usually forget cleaning something up, leading to longer dev-debug cycles. With useEffect I usually remember to clean up. Also, so far the code we've written with hooks looks (subjectively) nicer than their class counterparts. One difference between us might be that you have more experience than me using "classic" React. I'm relatively fresh to the React game, so I don't have many old habits or intuitions formed.
kls 7y ago
I have a huge functional programming proponent, but not when it comes to UI components, in my opinion this is the one and only place that OO shines, now in saying that I am not a big fan of deep nested inheritance, I prefer wrappers around more generic objects that delegate to the more generic object, but that is a personal preference. I am not too keen on hooks myself and prefer to use class based components to represent UI black boxes.
simplify 7y ago
You might be approaching hooks suboptimally. `useState` should be used for simple values, different than the catch-all `this.state` from class components. How do you arrive at nested functions? Hooks have generally flattened my indentation, and they are refreshingly easy to abstract over, making way for even cleaner code. For example, I have the following custom hook in multiple components: useNavigationWarning(() => !!commentBody) which adds an event listener to the window that warns the user about unsaved work, but only if `commentBody` has any content. Because it's a function, I can reuse the hook and swap out the callback body's conditional for each situation. With class components I would either have to use a higher-order component (bad and clunky), or copy/paste code across two separate lifecycle methods across each of my components that need this behavior.
kiliancs 7y ago
Hooks are not a new syntax for class components. All the lifecycle logic is recast as building blocks of your render logic. State, props and context become inputs you explicitly declare in the function, effects are explicitly linked to their dependencies, and in the end, with all the inputs in their current state there's your output. This makes it easier to understand how props, state, context and effects interact to produce the result, and makes it harder to make mistakes. It also simplifies complex scenarios and lets you encapsulate and reuse logic around all these building blocks.

sjogress 7y ago

I'm enjoying hooks so far, but I think I understand where you are coming from. The thing I enjoy with hooks is that you no longer have to juggle state/async in different methods. I'd usually forget cleaning something up, leading to longer dev-debug cycles. With useEffect I usually remember to clean up. Also, so far the code we've written with hooks looks (subjectively) nicer than their class counterparts. One difference between us might be that you have more experience than me using "classic" React. I'm relatively fresh to the React game, so I don't have many old habits or intuitions formed.

kls 7y ago

I have a huge functional programming proponent, but not when it comes to UI components, in my opinion this is the one and only place that OO shines, now in saying that I am not a big fan of deep nested inheritance, I prefer wrappers around more generic objects that delegate to the more generic object, but that is a personal preference. I am not too keen on hooks myself and prefer to use class based components to represent UI black boxes.

simplify 7y ago

You might be approaching hooks suboptimally. `useState` should be used for simple values, different than the catch-all `this.state` from class components. How do you arrive at nested functions? Hooks have generally flattened my indentation, and they are refreshingly easy to abstract over, making way for even cleaner code. For example, I have the following custom hook in multiple components: useNavigationWarning(() => !!commentBody) which adds an event listener to the window that warns the user about unsaved work, but only if `commentBody` has any content. Because it's a function, I can reuse the hook and swap out the callback body's conditional for each situation. With class components I would either have to use a higher-order component (bad and clunky), or copy/paste code across two separate lifecycle methods across each of my components that need this behavior.

kiliancs 7y ago

Hooks are not a new syntax for class components. All the lifecycle logic is recast as building blocks of your render logic. State, props and context become inputs you explicitly declare in the function, effects are explicitly linked to their dependencies, and in the end, with all the inputs in their current state there's your output. This makes it easier to understand how props, state, context and effects interact to produce the result, and makes it harder to make mistakes. It also simplifies complex scenarios and lets you encapsulate and reuse logic around all these building blocks.