Skip to main content
CF

Master Custom React Hooks with TypeScript

2h 21m 3s
English
Paid

Learn how to build your own custom React Hook package with clear steps and real TypeScript code. You will see how each part works, and you will test the hook as you build it.

What You Will Learn

You will write a custom React Hook with TypeScript. You will use simple patterns to keep your code clean and easy to read. You will also add features that make the hook useful for other developers who install it from npm.

Who This Course Is For

This course fits you if you know the basics of React and TypeScript. You do not need deep knowledge. Each lesson uses clear steps so you can follow the work and understand why each choice matters.

How the Course Works

The course has four modules. Each module builds on the one before it. You will write code, test ideas, and publish real packages.

Module 1: Project Setup

You will create the tools you need for the hook package. You will set up the build process and write a small demo app to test the hook in real time.

Module 2: Add Core Features

You will add useful features such as custom document titles and dynamic favicons. You will learn how to keep these features simple and safe.

Module 3: Improve and Publish the Package

You will tune your code for speed and stability. You will prepare the package for npm and publish it so others can install and use it.

Module 4: Build Docs and Examples

You will publish an example app that shows the hook in action. You will also create a small docs site so users can read clear setup steps and API details.

About the Author: Fullstack.io

Fullstack.io thumbnail

Fullstack.io is the technical book and course publisher founded by Nate Murray, Ari Lerner, and team — known for the ng-book Angular series, the React Quickly books, and the fullstack React series that anchored a generation of working developers' first deep-dive into modern JavaScript framework material. Fullstack.io has since rebranded to Newline for its newer course catalog.

The book / course catalog covers the modern JavaScript framework landscape — Angular, React, Vue, GraphQL, Node.js — at the level of comprehensive reference works rather than introductory tutorials. The Fullstack.io style is unusually rigorous about the underlying APIs and edge cases that ship projects to production.

The CourseFlix listing under this source carries over 20 Fullstack.io / Newline courses spanning that range. Material is paid; the original platform sold both per-course access and membership tiers. Courses are aimed at developers ready to move past introductory tutorials into the depth of a chosen framework.

Watch Online 19 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 19 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Course Introduction
All Course Lessons (19)
#Lesson TitleDurationAccess
1
Course Introduction Demo
01:06
2
Environment Setup With nvm
02:40
3
Scaffolding a React Hook Library with npm init
07:33
4
Building a Skeleton create-react-app to Test the Hook
04:53
5
Building Title Looping Functionality with the useEffect Hook
12:23
6
Packaging react-use-please-stay as an npm Module using Rollup
09:16
7
Cleaning Up and Refactoring react-use-please-stay
06:30
8
Implementing a Cascading Letter Functionality
07:56
9
Implementing a Marquee Functionality
07:45
10
Implementing Favicon Modification Functionality
08:24
11
Add Interval Time as a Hook Parameter
02:28
12
Add Should Always Play as a Hook Parameter
02:28
13
Use Custom Types to Type the Hook Parameters
11:37
14
Adding a Development-only Warning Logger
09:11
15
Prevent Concurrent Usages of the Hook
06:58
16
Restore Original Values on Refocus and Unmount
09:45
17
Publish the Hook to npm
05:40
18
Prepare the Example App as a Public Example Page
19:09
19
Publish the Example App to GitHub Pages
05:21
Unlock unlimited learning

Get instant access to all 18 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Related courses

  • Redux thumbnailUpdated 2y ago

    Redux

    By: UI.dev (Tyler McGinnis)
    There's no better strategy for learning a new technology than building your own version of it. In this course, we'll take that to the extreme.
    7h 13m
  • Advanced React For Enterprise: React for senior engineers thumbnailUpdated 2y ago

    Advanced React For Enterprise: React for senior engineers

    By: Udemy
    Welcome to the React for Senior engineers course ! Knowledge of React is 100% required for this course. I've been working with React.js for over 5 years now
    6h 4m
  • Build a Jira clone thumbnailUpdated 2y ago

    Build a Jira clone

    By: Antonio Erdeljac (Code With Antonio)
    In this 16-hour course, consisting of two parts (by the way, this is my longest course!).
    16h 26m

Frequently asked questions

What is Master Custom React Hooks with TypeScript about?
Learn how to build your own custom React Hook package with clear steps and real TypeScript code. You will see how each part works, and you will test the hook as you build it. What You Will Learn You will write a custom React Hook with…
Who teaches this course?
It is taught by Fullstack.io. You can find more courses by this instructor on the corresponding source page.
How long is the course?
It contains 19 lessons with a total runtime of 2 hours 21 minutes. Every lesson is available to watch online at your own pace.
Is it free to watch?
It is part of CourseFlix's premium catalog. A subscription unlocks the full video player; the course description, table of contents, and preview information are available to everyone.
Where can I watch it online?
The course is available to watch online on CourseFlix at https://courseflix.net/course/master-custom-react-hooks-with-typescript. The page hosts every lesson with the integrated video player; no download is required.