Passing Props and Toggling an Element in React.js
Aurooba and Brian complete their accordion in React.js as part of their series on building an accordion block. They discuss how components are loaded into the Dom, binding a value to the className attribute, and thoughts on prop drilling. The episode ends with a preview of the rest of Season One and thoughts on viewSource Season Two.
A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!
- Code from this episode - https://github.com/viewSourcePodcast/viewSource-blocks/tree/episode/accordion-content-on-page
- Brian's website – https://www.briancoords.com
- Aurooba's website – https://aurooba.com
00:00 Introduction
03:16 Previous code recap
06:54 Adding a key for looping elements
07:54 Components are not HTML elements
09:50 className
13:02 Doing expressions inside attributes
15:03 Adding CSS to our component
16:53 Prop drilling
19:10 useContext vs Prop Drilling
22:27 Attempting to remove a component
27:08 Next Steps for viewSource and Season 2
A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!
- Code from this episode - https://github.com/viewSourcePodcast/viewSource-blocks/tree/episode/accordion-content-on-page
- Brian's website – https://www.briancoords.com
- Aurooba's website – https://aurooba.com
00:00 Introduction
03:16 Previous code recap
06:54 Adding a key for looping elements
07:54 Components are not HTML elements
09:50 className
13:02 Doing expressions inside attributes
15:03 Adding CSS to our component
16:53 Prop drilling
19:10 useContext vs Prop Drilling
22:27 Attempting to remove a component
27:08 Next Steps for viewSource and Season 2
- (00:00) - E17 - React & Dom & Prop-Drilling
- (03:16) - Previous code recap
- (06:54) - Adding a key for looping elements
- (07:54) - Components are not HTML elements
- (09:50) - className
- (13:02) - Doing expressions inside attributes
- (15:03) - Adding CSS to our component
- (16:53) - Prop drilling
- (19:10) - useContext vs Prop Drilling
- (22:27) - Attempting to remove a component
- (27:08) - Next Steps for viewSource and Season 2
Creators and Guests
Host
Aurooba Ahmed
(she/her) Developer building bespoke #WordPress solutions, tools, and blocks. My name is pronounced "oo-ROO-ba" — Default to kindness, folks.
