Exercises: Conditional Rendering - React In Depth

Published: 30 August 2023
on channel: Tech with Nader
572
39

Let's go through some exercises to practice Conditional Rendering in React together.

We start with a warmup to get practice conditionally rendering JSX based on a prop passed in from a parent component.

Then we look at our first exercise where we take the warmup exercise and use State to manage to condition instead of the Prop.

For the second exercise, we look at how we can use events on an input to determine a matching password.

To wrap up the video, we look at a more involved example using arrays, state and map to conditionally render names to the DOM.

Chapters:
00:00 Introduction
00:36 Warmup Exercise - Prop Conditional
09:47 Exercise 1 - State and Conditional
16:34 Exercise 2 - Authenticated State
25:18 Exercise 3 - Arrays and State
46:16 Next Steps

📦 Github Repository with the notes and exercise code+solutions: https://github.com/Nooder/react-in-depth

💬 Come join us on Discord to chat with a like-minded community about tech and learning:   / discord  

🏅Support the channel and content through Super Thanks, Channel Memberships, or on Patreon:   / techwithnader  


On this page of the site you can watch the video online Exercises: Conditional Rendering - React In Depth with a duration of hours minute second in good quality, which was uploaded by the user Tech with Nader 30 August 2023, share the link with friends and acquaintances, this video has already been watched 572 times on youtube and it was liked by 39 viewers. Enjoy your viewing!