#react hooks

Subscribe
While ReactJS is one of the most popular frameworks out there, it still has its limits. That’s where React Hooks come to play: they are special functions that expand the abilities of functional components. Discover the following talks and workshops that will take you through React Hooks fundamentals and advanced techniques to ensure you’re always on top of your game.
You Can’t Use Hooks Conditionally… or Can You?
React Summit 2023React Summit 2023
28 min
You Can’t Use Hooks Conditionally… or Can You?
Top Content
It’s the hooks rule number one: “Only call hooks at the top level”.
But what if I told you that this rule does not apply to every hook? One of them can actually safely be used conditionally. 
To understand how useContext is different from other hooks, and why it is exempted from this major rule, we need to know why this rule exists in the first place. We will build our own mental model of react’s rendering behavior, focused on how react keeps track of data at runtime: props, states, refs… and context values.
Using React Hooks + Capacitor to Access Native Mobile APIs
React Summit 2020React Summit 2020
7 min
Using React Hooks + Capacitor to Access Native Mobile APIs
Using Capacitor, you can easily create native mobile iOS and Android applications using all of the React web tools you know and love. But how do we access the native APIs? With the @capacitor-community/react-hooks package, we can quickly and easily access native device APIs, like Camera, Filesystem, and Geolocation, using React Hooks!
Don't Forget React Memo
React Summit 2022React Summit 2022
7 min
Don't Forget React Memo
React developers intrigue us with the so-called React Forget compiler [that’s supposed to inject useMemo and useCallback into code automatically]. However, we still can't figure out best practices for useCallback, useMemo, and React.memo when we write it on our own. The worst scenario is if we continue to put it everywhere without understanding. As a result, it can bring noticeable harm to the performance of our application. In this talk, on real-life use cases, you will see solutions to the problem of using hooks wrong or overusing them!
Efficient State Management With Hookstate
React Advanced Conference 2021React Advanced Conference 2021
10 min
Efficient State Management With Hookstate
If you’ve worked with the React useState hook before, you might have wondered why global state management can’t be just as easy. Why do we still need so much boilerplate to manage state with the Context API? What if we don’t want to be constrained opinionated tools like Redux Toolkit or forced to use actions and reducers in our React applications? This is where Hookstate comes in. Hookstate is not just another state management solution. Apart from being feature-rich, fast, and flexible, the library takes the idea of simplifying state management in React apps to a whole new level. In this talk, I’ll introduce Hookstate as a simple and efficient state management solution for React applications.
We Don’t Know How React State Hooks Work
React Advanced Conference 2021React Advanced Conference 2021
28 min
We Don’t Know How React State Hooks Work
We use them all the time, and we think we know state hooks work (useState, useReducer). But under the hood, as expected, things are not what you imagine. This talk is about update queues, batching, eager and lazy updates, and some other cool things learned from looking at Hooks source code. It also contains practical takeaways that will help you better understand and debug your code.
Hooks are a great abstraction model
React Finland 2021React Finland 2021
13 min
Hooks are a great abstraction model
The discussion explores the separation of concerns between logic (Model) and UI (View) and how React hooks are a great abstraction model that help achieve that.
We'll start with designing a component's API (in a top down approach), then dive deeper to explore how to implement this API, while maintaining a good separation of concerns.
We'll create custom React hooks to implement the Model and React components for the UI. Both expose self-documenting APIs and are completely decoupled from each other.
To demo this approach, we'll create a simple Toggler component (a UI component that allows going back and forth in an array of values).Towards the end, we'll explore the benefits, focusing on testing these decoupled units in isolation.
The Psycological Effects of useEffect
React Summit 2020React Summit 2020
26 min
The Psycological Effects of useEffect
We have been using hooks for a while and with that we have also been using useEffect in particular and in this today I wanna take a look at the trickier parts of useEffect and why they work that way so you can leave with a super understanding of how this magic all works.
We Don’t Know How React State Hooks Work
React Summit Remote Edition 2021React Summit Remote Edition 2021
7 min
We Don’t Know How React State Hooks Work
We use them all the time, and we think we know state hooks work (useState, useReducer). But under the hood, as expected, things are not what you imagine. This talk is about update queues, batching, eager and lazy updates, and some other cool things learned from looking at Hooks source code. It also contains practical takeaways that will help you better understand and debug your code.