Master Custom React Hooks with TypeScript

Master Custom React Hooks with TypeScript

English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 19 Lessons (2h 21m) | 412 MB

Learn how to build an advanced React Hook with TypeScript, you will start from a blank editor and end with a complete and published open-source npm package. This course contains 19 lessons, each complete with live coding examples for students to study and build upon. By the end of the course, you’ll have built an extremely clean React Hook and published it to npm with multiple features, documentation, and a fully interactive example site. Along the way, you’ll also learn best practices around using TypeScript with React Hooks.

Build Powerful React Hooks with TypeScript

What you will learn

  • How to craft custom React Hooks using TypeScript
  • Importance of the full lifecycle (mount, unmount, and more) of React Hooks
  • How to integrate TypeScript types with custom React Hooks
  • What problems TypeScript with React Hooks can solve
  • How to create a community-ready custom React Hook package that is a joy to use
  • How to add basic functionalities including Title Looping, Packaging the Module using Roolup, and
  • Cleaning Up and Refactoring just to name a few.
  • How to add advanced functionalities including the immplementation of Cascading Letter, Marquee,
  • Favicon Modification, Interval Time as a Hook Parameter, and Should Always Plas as Hook
  • Parameter just to name a few.
  • How to implement optimization such as Custom Types, Development-only Warning Logger, preventing concurent usages of the Hook, restoring origional values on Refocus and Unmount, and more.
Table of Contents

1 Course Introduction
2 Environment Setup With nvm
3 Scaffolding a React Hook Library with npm init
4 Building a Skeleton create-react-app to Test the Hook
5 Building Title Looping Functionality with the useEffect Hook
6 Packaging react-use-please-stay as an npm Module using Rollup
7 Cleaning Up and Refactoring react-use-please-stay
8 Implementing a Cascading Letter Functionality
9 Implementing a Marquee Functionality
10 Implementing Favicon Modification Functionality
11 Add Interval Time as a Hook Parameter
12 Add Should Always Play as a Hook Parameter
13 Use Custom Types to Type the Hook Parameters
14 Adding a Development-only Warning Logger
15 Prevent Concurrent Usages of the Hook
16 Restore Original Values on Refocus and Unmount
17 Publish the Hook to npm
18 Prepare the Example App as a Public Example Page
19 Publish the Example App to GitHub Pages

Homepage