Courses
All coursesAI PathFrontend Path

Not sure where to start?

Let us help you find your perfect course.
PricingCoursesLog in
For TeamsWhy Scrimba?
Courses
All coursesAI PathFrontend Path

Not sure where to start?

Let us help you find your perfect course.
Pricing
PricingCreate Account
Log in
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Courses
All coursesAI PathFrontend Path

Not sure where to start?

Let us help you find your perfect course.

Karma

DashboardConnect to DiscordFind a courseSettingsNew scrim
Log out

Reusability

This playlist is part of Advanced React

Reusability

67 lessons4 hours 59 min

1. Advanced React Intro
4:38
2. Button - props review challenge
4:13
3. Aside - children in HTML
2:12
4. Aside - React Children
1:53
5. Challenge - Button w/ Children
1:38
6. Button - More Complex React Children
5:37
7. Challenge - add onClick event listener
2:52
8. Aside - props spreading
3:24
9. Aside - Destructuring props
3:32
10. Button - size prop
5:16
11. Button - fix className issue
6:55
12. Challenge - Button w/ Variants
4:17
13. Mega Challenge - Overloaded Avatar Component
10:05
14. Menu Component Intro
5:24
15. Prop Drilling
4:53
16. Aside: Compound Components Intro
4:52
17. Compound Components in React - Part 1
3:38
18. Compound Components Quiz
3:48
19. Compound Components in React - Part 2
2:24
20. Compound Components in React - Part 3
5:59
21. Summarize Challenge - Compound Components in React
0:42
22. Prop Drilling Problem #2 - Implicit State
3:46
23. The React.Children API
8:55
24. React.Children shortcomings
6:58
25. Context Intro
2:44
26. createContext() & Context Provider
5:42
27. useContext()
6:32
28. Add context to the Menu component
4:28
29. State + Context
6:30
30. Theme switcher final touches
2:04
31. Menu component final touches
4:11
32. A11y in menu component
6:30
33. Aside - Compound components w/ dot syntax
2:46
34. Headless Toggle component
3:54
35. Toggle - setup
5:14
36. Toggle - Planning
2:28
37. Toggle Context
3:41
38. Toggle.Button
6:39
39. Toggle.On & Toggle.Off
4:39
40. Remove Star component
5:07
41. Use Toggle with Menu component
7:44
42. Composing new components with Toggle
8:17
43. onToggle event listener
6:57
44. Menu onClose event
1:59
45. Intro to Refs
6:34
46. Refs and DOM manipulation
5:12
47. Fix onToggle bug using refs
3:21
48. Fix missing onToggle bug using a noop function
2:12
49. Render Props Part 1
5:05
50. Render Props Part 2
7:51
51. Render Props Part 3
5:36
52. Render Props Part 4 - children as render props
2:11
53. Toggle.Display intro
2:05
54. Toggle.Display
6:01
55. Custom Hooks Intro
1:55
56. Custom Hooks - useEffectOnUpdate
7:57
57. Custom Hooks - useToggle
4:45
58. Custom Hooks - useToggle part 2
3:13
59. Custom Hooks - useToggle part 3
2:57
60. Custom Hooks - useToggle part 4
3:04
61. Custom Hooks - useToggle part 5
3:05
62. Custom Hooks - useToggle part 6
4:56
63. Custom Hooks - useToggle part 7
1:42
64. Custom Hooks - useToggle part 8
3:41
65. Custom Hooks - useToggle part 9
2:22
66. Reusability section recap
1:39
67. Solo Project - Component Library++
5:59

HomePlans & PricingTeacher talent program

Community

Explore the communityPodcastYouTubeGet Scrimba emails

Courses

All courses Self-paced BootcampFree coursesPro courses

Company

About usSupport centerTermsPrivacy

Built with Imba