TOIT Training
(909) 252-7584
[email protected]
Search
Log in
Menu
Home
Library
IT Library
Developer Courses
User Cuorses
Plans & Pricing
Features
About Us
Contact Sales
Roadmap
Home
Courses
Full Stack Development
Advanced React
Curriculum
3 Sections
170 Lessons
Lifetime
Expand all sections
Collapse all sections
01. Reusability
66
1.1
Custom Hooks – useEffectOnUpdate
1.2
Custom Hooks – useToggle
1.3
Custom Hooks – useToggle Part 2
1.4
Custom Hooks – useToggle Part 3
1.5
Custom Hooks – useToggle Part 4
1.6
Custom Hooks – useToggle Part 5
1.7
Custom Hooks – useToggle Part 6
1.8
Custom Hooks – useToggle Part 7
1.9
Custom Hooks – useToggle Part 8
1.10
Custom Hooks – useToggle Part 9
1.11
Reusability Section Recap
1.12
Solo Project – Component Library++
1.13
Remove Star Component
1.14
Use Toggle with Menu Component
1.15
Composing New Components with Toggle
1.16
onToggle Event Listener
1.17
Menu onClose Event
1.18
Intro to Refs
1.19
Refs and DOM Manipulation
1.20
Fix onToggle Bug Using Refs
1.21
Fix Missing onToggle Bug Using a Noop Function
1.22
Render Props Part 1
1.23
Render Props Part 2
1.24
Render Props Part 4 – Children as Render Props
1.25
Render Props Part 3
1.26
Toggle.Display Intro
1.27
Toggle.Display
1.28
Custom Hooks Intro
1.29
Compound Components Quiz
1.30
Compound Components in React – Part 2
1.31
Compound Components in React – Part 3
1.32
Summarize Challenge – Compound Components in React
1.33
Prop Drilling Problem #2 – Implicit State
1.34
The React.Children API
1.35
React.Children Shortcomings
1.36
Context Intro
1.37
createContext() & Context Provider
1.38
useContext()
1.39
Add Context to the Menu Component
1.40
Compound Components in React – Part 1
1.41
State + Context
1.42
Theme Switcher Final Touches
1.43
Menu Component Final Touches
1.44
Headless Toggle Component
1.45
Aside – Compound Components W/ Dot Syntax
1.46
Toggle – Setup
1.47
Toggle – Planning
1.48
Toggle Context
1.49
Toggle.Button
1.50
Toggle.On & Toggle.Off
1.51
Button – Props Review Challenge
1.52
Advanced React Intro
1.53
Aside: Compound Components Intro
1.54
Prop Drilling
1.55
Menu Component Intro
1.56
Mega Challenge – Overloaded Avatar Component
1.57
Challenge – Button W/ Variants
1.58
Button – Fix ClassName Issue
1.59
Button – Size Prop
1.60
Aside – Destructuring Props
1.61
Aside – Props Spreading
1.62
Challenge – Add onClick Event Listener
1.63
Button – More Complex React Children
1.64
Challenge – Button W/ Children
1.65
Aside – Children in HTML
1.66
Aside – React Children
02. Routing
85
2.1
Placeholders Are Gone! ?
2.2
Cloud Firestore Setup ?
2.3
Collection Ref and getVans() Function
2.4
Cloud Firestore Code Setup
2.5
Create getVan Function
2.6
Refactor getHostVans Function
2.7
Final Loose Ends
2.8
Outro
2.9
Challenge – Send User to Original Page
2.10
useLocation
2.11
Link State
2.12
Back to All Vans
2.13
Challenge: Conditionally Render the Back Button Text
2.14
404 Page
2.15
Coding the Sad Path – Error Handling (New)
2.16
“Happy Path” vs. “Sad Path” (New)
2.17
Quick Update to Our Fetching Code
2.18
Initial Login Form
2.19
Note from the Future: Importing Image Assets in Vite
2.20
Coding the Sad Path – Loading State (New)
2.21
Protected Routes Intro (FDCP)
2.22
Protected Routes – AuthRequired Layout Route (FDCP)
2.23
Protected Routes – Implementing “Auth” (FDCP)
2.24
Protected Routes – Navigate (FDCP)
2.25
VanLife Protected Routes (FDCP)
2.26
Protected Routes Quiz
2.27
Navigation State (FDCP)
2.28
Setup for Authentication – Happy Path (FDCP)
2.29
Authentication Setup – Sad Path (FDCP)
2.30
Navigate to /Host Route After Login (FDCP)
2.31
Nested Routes Quiz
2.32
Add Footer
2.33
NavLink
2.34
Active Link Styling with NavLink
2.35
Active Link Styling with NavLink – Part 2
2.36
Adding Host Vans Routes
2.37
? Optional Side Quest – Building Out the Host Vans List and Detail Pages
2.38
Building Out the Host Van Detail Page
2.39
Relative Links
2.40
Back to All Vans
2.41
Add /Host/Vans/:Id Nested Routes
2.42
Add the Final Navbar!
2.43
Outlet Context
2.44
Search Params Intro
2.45
useSearchParams
2.46
Challenge: Set Up Search Params in VanLife
2.47
Filter the Array W/ the Search Param
2.48
Challenge: Filter the Vans in VanLife
2.49
Using Links to Add Search Params
2.50
Challenge: Filter the Vans with Links
2.51
Using the Search Params Setter Function
2.52
Challenge: Filter the Vans with a Setter Function
2.53
Caveats to Setting Params
2.54
Merging Search Params with Links
2.55
Merging Search Params with the setSearchParams Function
2.56
Challenge: Conditional Rendering Practice
2.57
Fix Remaining Absolute Paths
2.58
History Stack and Replace (FDCP)
2.59
React Router Setup & BrowserRouter
2.60
Multi-Page vs Single-Page Apps
2.61
Route Params – Part 1
2.62
Challenge: Vans Page – Part 2
2.63
Mirage JS Server
2.64
Challenge: Vans Page – Part 1
2.65
Initial Deploy to Netlify
2.66
VanLife Project Bootstrapping
2.67
Link
2.68
Quick Re-Org
2.69
Route, Path, & Element
2.70
BrowserRouter & Routes Challenge
2.71
Routes
2.72
Introduction to React Router 6
2.73
To Nest or Not to Nest?
2.74
Index Routes
2.75
Creating the Host Layout
2.76
Nested Routes Intro
2.77
Fixing the Navbar with a Layout Route
2.78
Fixing the Navbar with a Layout Route Part 2
2.79
Bootstrap the Host Pages
2.80
Nesting the /Host Routes
2.81
Relative Paths
2.82
Route Params Quiz
2.83
Route Params Part 3.1 – useParams() & Challenge
2.84
Route Params Part 3.2 – useParams() Challenge
2.85
Route Params – Part 2
03. Performance
19
3.1
Course Outro
3.2
Code Splitting, Lazy, Suspense – Part 1
3.3
StrictMode – Rerunning Side Effects
3.4
StrictMode – Double Renders Components
3.5
Using Dev Tools to Measure Performance
3.6
Rendering Phases Quiz
3.7
Three Phases of “Rendering”
3.8
Recursive Rendering
3.9
Performance Intro
3.10
useCallback() Practice
3.11
useCallback()
3.12
useMemo() Practice
3.13
useMemo(), React.memo(), and Referential Equality
3.14
Value vs. Reference Types & Referential Equality
3.15
React.memo() Practice
3.16
React.memo() – Reducing Rerenders
3.17
useMemo() Practice
3.18
useMemo()
3.19
Code Splitting, Lazy, Suspense – Part 2
This content is protected, please
login
and
enroll
in the course to view this content!
