Hooks

Hooks

Introducing Hooks, JavaScript functions with callbacks "I will call back later!" React has built in hooks like useState or copy pasta some written by developers, one can also write their own hooks too.

A hook like useState keeps track of State an object that contains the state of your app in key-value pairs. State determines how your components render and behave. A way to keep track of a users interactions / behavior with your app update state with setState function state of app to be accessed globally.

Hooks can be strings, numbers, booleans, arrays objects and any combination of these. destructure as it's a named export { useState } initialize [state, setState] = useState()

Functional components an alternative to classes which for me I prefer in my opinion, it makes for cleaner more concise code and of course removing the this keyword is always good

• Some hooks that I have used so far

  • useState this is an everyday hook

  • useEffect

    • renders side effects
    • runs on every render unless a dependance injection [] empty array runs once if it's added to the array it renders on change
    • fetch url endpoint input box

  • useParams

    • react router

  • useNavigation

    • react router

  • useLocation

    • react router

REferences

Medium @anwesha_das tracking user interactions in React Redux part 1