How React hooks work - in depth

• how-react-hooks-work

  4 107 0.0 JavaScript

  Understand how React-hook really behaves, once and for all!

code sandbox of all examples: https://codesandbox.io/s/github/Eliav2/how-react-hooks-work webpage of sandbox(examples on full screen): https://d47vv.csb.app/ GitHub repo: https://github.com/Eliav2/how-react-hooks-work

• react-xarrows

  2 563 4.0 TypeScript

  Draw arrows (or lines) between components in React!

so why do we need to understand all of this? well, in simple cases you don't, but when dealing with a component with a complicated lifecycle you can sometimes get confused by the component's behavior. an example of such component will be react-xarrow which needs to trigger callback on different phases to get the right dimensions and activate animations callbacks on different phases, for that react-xarrows using react-use-call-onnext-render to schedule callback for later phases.

• SurveyJS

  surveyjs.io featured

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• react-use-call-onnext-render

  2 2 6.9 JavaScript

  Discontinued A custom hook that can be used to schedule a callback function on later render, optionally forced!

so why do we need to understand all of this? well, in simple cases you don't, but when dealing with a component with a complicated lifecycle you can sometimes get confused by the component's behavior. an example of such component will be react-xarrow which needs to trigger callback on different phases to get the right dimensions and activate animations callbacks on different phases, for that react-xarrows using react-use-call-onnext-render to schedule callback for later phases.

Suggest a related project