Learn React Hooks

Creating a local Register Effect Hook

First of all, we are going to extract the Effect Hook from our Login component to a separate useRegisterEffect Hook function. This function will accept the following values from other Hooks as arguments: user and dispatch.

Let's create a local Effect Hook for the Register component now using the following steps:

1. Edit src/user/Register.js and define a new function outside of the component function, right after the import statements:

function useRegisterEffect (user, dispatch) {

2. For the contents of the function, cut the existing Effect Hook from the Register component and paste it here:

    useEffect(() => {        if (user && user.data) {            dispatch({ type: 'REGISTER', username: user.data.username })        } }, [dispatch, ...