Back to Browse

Exercises: Conditional Rendering - React In Depth

776 views
Aug 31, 2023
47:31

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: https://discord.gg/K4nkugP7Gd 🏅Support the channel and content through Super Thanks, Channel Memberships, or on Patreon: https://www.patreon.com/TechWithNader

Download

1 formats

Video Formats

360pmp478.3 MB

Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.

Exercises: Conditional Rendering - React In Depth | NatokHD