In this lesson we take all of the hooks and logic from our “ component and put them into a custom hook called `useCurrencyCodes()`. What’s the difference between a custom hook and a function we can use to organize our logic? Not much, really. Because … more Read More
With React hooks it’s common to write callback functions in our component body. Event handlers are a common example of this. Most of the time they work great, however, when you’re passing those event handlers down to a child component or using them as … more Read More
The [useEffect](https://reactjs.org/docs/hooks-effect.html) hook provides a way for components to declaratively state side effects that need to be run. By modifying the dependency array you can simulate certain React lifecycle methods such as `constructor`/`componentDidMount` … more Read More
In addition to storing DOM references, the [useRef](https://reactjs.org/docs/hooks-reference.html#usecallback) hook can be used to store values without re-rendering the component. If you have a class component that stores and manipulates values using … more Read More
In this lesson we replace `React.createRef()` with the `React.useRef` hook. The API is almost identical, so the there’s not much to it, if you’re already familiar with refs. In React, refs provide a way to store references to native DOM elements. Throughout … more Read More
Our class-based component relies on instance variables to ensure it’s only created once. “` this.amountChanged = debounce(this.props.changeAmount, 500); “` Functional components aren’t classes and therefore don’t have instance variables. Because of … more Read More
In this lesson we convert our AmountField class component to a function component and then convert its state from `this.state`/`this.setState` to the [useState](https://reactjs.org/docs/hooks-state.html) hook. As in our earlier lesson we apply the following … more Read More
Sometimes, you want your application to confirm user identities even when they are logged in. This is especially useful for sensitive routes and actions like deleting a user-owned resource, updating a delivery address, or completing a financial transaction … more Read More
Laravel Livewire is a library for building reactive and dynamic interfaces using Blade as your templating engine. It works by making AJAX requests to the server when a user interaction occurs and rendering the updated HTML sent to it by the server. In … more Read More
