Intro
Let's implement a generic hook for handling any kind of authorization/authentication with an abstracted model and consistent API.
Why?
Authorization on frontend can be tricky. The logic of it varies depending on what we use for authorization. Suppose you have three methods of authorization - Google, Facebook and the usual login form.
For the application it should make no difference what kind of provider it is. So we need an abstraction that will give the application all the tools to authorize with any provider.
Usage
Loading
Implementation
Loading
- 1. Rendering
16 minutes
Creating portals with custom usePortal hook
2 m
We will change the screens with useStepper hook
3 m
Manage components appearance with useToggle hook
4 m
Removing server warnings for useLayoutEffect with custom hook
3 m
First interaction detection with useOnInteraction hook
4 m
- 2. Forms
4 minutes
- 3. Events
26 minutes
Read the scroll metadata and direction with useScroll hook
5 m
Using clipboard with useClipboard hook
4 m
Detect outside click with the useClickOutside hook
6 m
Deep dive into useIntersectionObserver hook
4 m
Element size measurement with useElementSize hook
7 m
- 4. Guards
5 minutes
- 5. Interactions
5 minutes
Comments
Add your honest opinion about this article and help us improve the content.