24 Matching Annotations
  1. Dec 2019
    1. Mutations, subscriptions, timers, logging, and other side effects are not allowed inside the main body of a function component (referred to as React’s render phase). Doing so will lead to confusing bugs and inconsistencies in the UI.

      key point!

    2. What does useEffect do? By using this Hook, you tell React that your component needs to do something after render

      key point!

    3. In React class components, the render method itself shouldn’t cause side effects. It would be too early — we typically want to perform our effects after React has updated the DOM.

      key point!

    4. Custom Hooks are more of a convention than a feature. If a function’s name starts with ”use” and it calls other Hooks, we say it is a custom Hook. The useSomething naming convention is how our linter plugin is able to find bugs in the code using Hooks.

      as can be seen above, indeed nothing explicetly tells that the function is a special kind of hook. its just a function...

    1. Data fetching, setting up a subscription, and manually changing the DOM in React components are all examples of side effects

      key point. this means that all those small messing of variables in code that gets rendered into the template of the component? this is all 'side effects', and of course we do this all the time...

  2. Nov 2019
    1. React guarantees that setState function identity is stable and won’t change on re-renders. This is why it’s safe to omit from the useEffect or useCallback dependency list.
  3. Oct 2019
  4. Sep 2019
  5. Aug 2019
    1. const useFocus = () => { const htmlElRef = useRef(null) const setFocus = () => {htmlElRef.current && htmlElRef.current.focus()} return [ setFocus, htmlElRef ] }

      exampleOf: useRef exampleOf: custom hook