Practical Typescript
Master TypeScript from basics to advanced concepts through hands-on tutorials covering type annotations, generics, data fetching, Zod library, and more, with practical challenges for effective real-world application.
Example Curriculum
Setup
Available in
days
days
after you enroll
Typescript Fundamentals
Available in
days
days
after you enroll
- Type Annotations (4:42)
- Type Inference (1:37)
- First Challenge (3:27)
- Useful Setup Info (3:02)
- Union Type (4:15)
- Type : Any (3:24)
- Practical Example (5:35)
- Challenge - Union Type (2:00)
- Arrays (4:48)
- Challenge - Arrays (2:03)
- Objects - Fundamentals (8:08)
- Challenge - Objects (3:32)
- Functions - Params (4:56)
- Functions - Returns (4:03)
- Type Any - Example (3:12)
- Challenge - Functions (3:45)
- Functions - Optional Params (2:28)
- Functions - Default Parameter (2:31)
- Functions - Rest Parameter (6:05)
- Functions - Void Keyword (1:46)
- Type Guards (4:05)
- Functions - Objects as Parameters (5:57)
- Excess Property Check (2:38)
- Challenge - Functions II (6:03)
- Type Alias (5:09)
- Type Alias - Additional Info (2:42)
- Challenge - Type Alias (7:30)
- Intersection Type (3:50)
- Computed Properties (1:29)
- Interface - Fundamentals (5:05)
- Interface Methods (5:32)
- Interface Methods - More Options (6:49)
- Challenge - Interfaces (3:46)
- Interfaces - Merge and Extend (11:03)
- Challenge - Interface II (7:42)
- Interfaces - Type Predicate (5:04)
- Interface vs Type Alias (2:11)
- Tuples (5:10)
- Enums - Fundamentals (4:33)
- Enums - Reverse Mapping (4:22)
- Challenge - Enums and Tuples (3:13)
- Type Assertion (7:56)
- Type - Unknown (6:16)
- Type - Never (8:31)
- Modules - Intro (5:11)
- Modules - ES6 (7:21)
- Modules - JS File (3:41)
- Type Guards - Typeof (4:15)
- Type Guards - Equality and "in" (3:50)
- Type Guards - Truthy and Falsy (3:01)
- Type Guards - Instanceof (5:18)
- Type Guards - Type Predicate (4:53)
- Type "never" Gotcha (2:57)
- Type Guards - Discriminated Unions (7:35)
- Generics - Intro (7:59)
- Generics - First Function and Interface (5:33)
- Generics - Promise Example (4:15)
- Generics - Create Array (5:13)
- Generics - Multiple Types (2:11)
- Generics - Type Constraints (4:08)
- Generics - Type Constraints Second Example (3:46)
- Generics - Default Type (6:15)
- Fetch Data - Basics (7:04)
- Fetch Data - Setup Types (3:02)
- Fetch Data - Gotcha (2:02)
- Zod Library (8:17)
- Declaration Files (8:51)
- TS Config (3:21)
- Classes - Intro (2:56)
- Classes - Default Property (2:25)
- Classes - Readonly Modifier (0:54)
- Classes - Public and Private Modifiers (4:38)
- Classes - Constructor Shortcut (3:16)
- Classes - Getters and Setters (5:13)
- Classes - Implement Interface (2:47)
- Tasks Project - Setup (7:37)
- Tasks Project - Useful Info (10:13)
- Tasks Project - Select Elements (4:35)
- Tasks Project - Submit Event (3:22)
- Tasks Project - Event Gotcha (2:17)
- Tasks Project - Add Task (2:16)
- Tasks Project - Render Task (2:40)
- Tasks Project - Local Storage (5:35)
- Tasks Project - Checkbox (3:22)
React with Typescript
Available in
days
days
after you enroll
- Setup (1:58)
- Files and Folders (6:18)
- Component Return (4:35)
- Props - Inline (5:02)
- Props - Type Alias / Interface (1:41)
- Children Prop (5:55)
- State (7:13)
- State - Custom List (4:35)
- Events - Change Event (6:31)
- Events - Form Event (9:21)
- Challenge - Intro (2:58)
- Challenge - First Solution (7:20)
- Challenge - Alternative Approach (1:33)
- Challenge - Typescript Solution (5:14)
- Context API - Basic Example (11:27)
- Context API - Theme Example (6:47)
- useReducer - Setup (5:02)
- useReducer - Counter (4:36)
- useReducer - Status (4:40)
- Fetch Data - UseEffect and Fetch API (8:07)
- Fetch Data - Type and Schema (6:36)
- Fetch Data - React Query and Axios (9:20)
- RTK - Slice (11:08)
- RTK - Setup (4:58)
- RTK - Complete (3:50)
- Tasks Project - Setup (4:06)
- Tasks Project - Form Setup (4:00)
- Tasks Project - Add Task (3:15)
- Tasks Project - List (5:47)
- Tasks Project - Local Storage (3:28)
Store Project
Available in
days
days
after you enroll
- Intro (2:19)
- Setup (2:14)
- Boilerplate (5:25)
- Tailwind Intro (1:13)
- Tailwind Info (9:32)
- Tailwind Install (2:43)
- Shadcn/ui Install (7:58)
- Shadcn/ui Info (8:46)
- Redux Toolkit - Setup (8:03)
- Create Pages (8:29)
- React Router Setup (4:34)
- Link Component (4:58)
- Outlet Component (10:19)
- Header Component (12:00)
- Tailwind Custom Class (2:38)
- Navbar Component - Setup (7:43)
- Logo Component (3:18)
- Links List (3:56)
- LinksDropdown Component (9:31)
- NavLinks Component (3:03)
- Change Theme (2:42)
- Apply Theme Function (5:24)
- Theme Slice (4:11)
- ModeToggle Component (4:41)
- CartButton Component (2:59)
- ErrorPage Component (9:30)
- About Page Component (2:40)
- ErrorElement Component (5:15)
- Landing Page Component - Setup (3:16)
- Custom Fetch - Function (3:45)
- Products Types (4:28)
- Loader Function (4:43)
- Landing Loader (10:39)
- Section Title (5:06)
- FormatAsDollars Function (4:27)
- Products Grid Component (7:50)
- Hero Component (3:42)
- Hero Carousel Component (6:05)
- Products Page - Setup (8:17)
- Products List (8:17)
- Products Container (14:40)
- Global Loading Setup (5:21)
- Loading Component (6:32)
- Filters Component - Setup (13:49)
- Query Params (6:50)
- Default Value (6:04)
- Form Input (6:29)
- Form Select (12:42)
- Form Range (10:56)
- Form Checkbox (6:26)
- Pagination Setup (4:44)
- Helper Functions (5:48)
- Pagination Container (13:05)
- Construct URL - Complete (9:30)
- React Router - Url Params (4:25)
- Single Product Page - Setup (6:11)
- Fetch Single Product (7:05)
- Fetch Single Product - Render Image and Info (8:46)
- Select Product Colors Component (7:59)
- Select Product Amount Component (15:05)
- Toast Component (4:06)
- Cart Slice - Setup (7:48)
- Add Item - Recucer (7:14)
- Clear Cart - Reducer (1:14)
- Remove Item - Reducer (4:15)
- Edit Item - Reducer (3:02)
- AddToCart Functionality (7:23)
- Cart Page - Setup (9:02)
- Cart Totals Component (5:49)
- Cart Items List (9:07)
- First Column (1:51)
- Second Column (9:33)
- Third and Fourth Column (9:41)
- User Slice (9:43)
- Register and Login Request API Info (3:27)
- Register Page Setup (6:58)
- Register User Action (7:47)
- Register User Request (10:30)
- Submit Button Component (7:05)
- Login Page Setup (6:18)
- Login Guest User Request (8:13)
- Login User Action and Request (10:45)
- Access User in Header Component (4:38)
- Access User in NavLinks, LinksDropdown and CartButton Components (4:55)
- Checkout Page Setup (7:44)
- Checkout Page Loader (3:05)
- Checkout Form Component Setup (6:12)
- Checkout Form Action (13:19)
- OrdersResponse Type (2:17)
- Orders Page Loader (9:54)
- Orders List Component (8:26)
- Complex Pagination Component (15:26)
- Deploy Application (8:28)
Check your inbox to confirm your subscription