GreenOn
Software
ArticlesAuthorsCourses
Create articleMentoring
Join
HomeCoursesReact hooks spellbook
Start
Course overview

React hooks spellbook

56 minutes
created: 20-03-2023
updated: 20-03-2023
PENDING
Description

Become a React wizard and learn powerful spells in the form of popular hooks created by our community.

Kacper Woźniak

Technical check

Adrian Połubiński

Author

Krzysztof Reszko

Linguistic check

Technologies
typescript
react
rxjs
Chapters & lessons
  • 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

    • Forms management with useForm hook

      4 m

  • 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

    • Authorization with useAuth hook

      5 m

  • 5. Interactions

    5 minutes

    • Hiding window and HTML element scroll with the useScrollHide hook

      5 m

Statistics

5

Chapters

13

Lessons

About us

We're an educational platform that produces high quality articles, courses and teaching materials.

You can join our community via this link.

Recommended articles

Renaming git commits
Mastering article crafting in 10 steps
Common mistakes in using React Context API
NRWL extension and why do we need our own cli in JavaScript
Testing and mocking ResizeObserver in JavaScript
React components based on design system with styled-components
How to integrate state management in Zustand with NextJS
Types vs interfaces in TypeScript fully explained
Working with selectors in Zustand and Redux
Concerns about separating types from implementation
Make your components healthy with these patterns
How to work with e2e selectors in tests
Comparing Redux with Zustand for state management in React
Working with local storage vs session storage
Overview of the main functionalities of the NX tool
This keyword in JavaScript

Navigation

ArticlesAuthorsCoursesCreate articleMentoringHome

Powered by GreenOn Software