Welcome to

Craft a Custom React Hook npm Package with React and TypeScript

Build Powerful React Hooks with TypeScript

Course Syllabus and Content

Statistics:

  • Total Modules: 4
  • Total Lessons: 19
  • Total Video Runtime: 2 hours and 22 minutes

Unlock the Power of React Hooks and TypeScript:

In this comprehensive course, you will embark on a journey that spans 4 modules, comprising 19 lessons, with a total video runtime of 2 hours and 22 minutes. No frills, just practical knowledge to elevate your skills in React development.

Module Breakdown:

Module 1: Building the First Functionalities of the react-use-please-stay Hook

  • Dive into the basics with a course introduction and environment setup.
  • Learn to scaffold a React Hook library and build a skeleton app to test the hook.
  • Explore the intricacies of the useEffect hook in creating title looping functionality.
  • Package your custom hook as an npm module using Rollup.
  • Conclude with cleaning up and refactoring your newly created React Hook.

Module 2: Adding Advanced Functionalities to react-use-please-stay

  • Implement cascading letter functionality, a marquee effect, and favicon modification.
  • Customize the hook parameters by adding interval time and should always play options.

Module 3: Finishing Touches and Optimizations

  • Utilize custom types to type the hook parameters effectively.
  • Add a development-only warning logger for enhanced debugging.
  • Prevent concurrent usages of the hook and restore original values on refocus and unmount.
  • Conclude with the process of publishing your hook to npm.

Module 4: Finalizing and Publishing the Example App

  • Prepare the example app as a public example page.
  • Publish the example app to GitHub Pages for wider accessibility.

Embark on a structured learning path, diving into each module at your own pace. Build practical skills and gain valuable insights into crafting custom React Hook npm packages with TypeScript. Let's delve into the details together.

Module 1

Building the First Functionalities of the react-use-please-stay Hook

6 Lessons 39 Minutes

Module 2

Adding Advanced Functionalities to react-use-please-stay

5 Lessons 28 Minutes

Module 3

Finishing Touches and Optimizations

5 Lessons 45 Minutes

Module 4

Finalizing and Publishing the Example App

2 Lessons 24 Minutes