DEV Community

loading...

Why does React Hooks enable writing simpler code? 🎣

Sebastian Weber
Frontend developer from Germany.
Updated on ・1 min read

While learning React Hooks I have read a lot about the conceptual decisions of the React team. E.g., they state that React components with React Hooks are easier to write and understand as Class components.

Why do you think writing projects with React Hooks will lead to more understandable and maintainable code?

Discussion (4)

Collapse
dance2die profile image
Sung M. Kim

Hooks enables "function component" (FC) to "hook" into React's life cycle methods getting rid of the need to use "class components" (CC).

The reason this makes it more "understanble" & "maintainable" code is

  1. Within FC, you don't neeed this mostly to refer to internal methods, variables thus make the code shorter and less error prone.
    • this in JavaScript is pretty tough to swallow. Less of it to deal with easier to understand.
  2. Hooks makes code shorter (refer to this image comparison as an example).
    • Less boiler plate code required means, less code to maintain, thus easier to maintain and faster to develop.
  3. And also, clean up codes can be co-located without spreading through React life cycle methods such as componentDidMount, componentWillUnmount, which is usually an error-prone process.

Would anyone else share more reasons? (or spot any mistakes I have?)

Collapse
doppelmutzi profile image
Sebastian Weber Author

Thanks a lot for this helpful explanation.

Collapse
dance2die profile image
Sung M. Kim

You're welcome.
Enjoy React with 🎣

Collapse
doppelmutzi profile image
Sebastian Weber Author

Using React Context is less verbose and, thus, much easier to understand and develop.