Hooks

    Hooks are specially-implemented functions that let us add functionality to React components beyond just creating and returning React elements.

    We'll look at the following built-in hooks in more detail:

    • useState - Persist state within a component function
    • useReducer - Similar to useState, but for state that involves multiple sub-values
    • useEffect - Perform side effects within our component functions
    • useRef - Wrap a mutable value

    We can also compose built-in hooks to build our own.

    Rules and Linting

    Hooks aren't regular functions; they have to be written in a certain way. To dive deeper into this topic, check out Rules of Hooks.

    When using hooks, we typically want to use eslint and the react-hooks plugin. Hooks are powerful, but can be unintuitive at first, and this tool catches a lot of mistakes before we ever run our code. The Rules of Hooks link has more detail on how to install this.

    Previous:
    Memo
    Next:
    useState
    Contents
    1. Rules and Linting

    Want to learn React Native in-depth?

    If you like React Native Express, you'll love my new book, Fullstack React Native: The complete guide to React Native! Throughout the book, we'll build 7 full apps, covering complex topics like navigation, gestures, and native modules. We don't assume any knowledge of React or newer JavaScript language features, so you can dive right in regardless of your experience level. The book comes in PDF, EPUB and MOBI formats.

    Check it out!

    Community Resources

    Looking for more help?

    Infinite Red sponsors React Native Express and is the premier React Native agency. They're also the team behind the React Native newsletter, podcast, and conference listed here. Get in touch at infinite.red/react-native for a proposal on your next project!