Learn React from Bob Ziroll

Learning React can feel challenging at first, especially when you’re unsure of how to start or find yourself staring at an empty code editor. But the right course can help you understand the core concepts and help you gain practical experience by building real-world projects.

We just published a course on the freeCodeCamp.org YouTube channel that teaches you modern React in the most engaging, hands-on way possible. Created by Bob Ziroll from Scrimba, this course is packed with over 170 coding challenges and six exciting projects. By the end, you’ll have the skills and confidence to develop React applications that solve real-world problems. Bob’s previous React course is one of the most popular ways to learn React and he’s completely updated this course to teach all the newest React concepts.

What You’ll Learn in This Course

The course is structured into six comprehensive sections, starting with the basics and gradually advancing to more complex concepts:

1. React Basics
   Dive into the foundations of React, including JSX, components, props, state, and the principles of React’s declarative and composable design. Your first project, ReactFacts, is a simple and fun introduction to building functional components and applying styles.

2. Travel Journal Project
   Learn to create reusable components and work with props. You’ll use JavaScript’s .map() function to dynamically render a travel journal, making it both functional and visually appealing.

3. Chef Claude Project
   Explore state management and forms while building a recipe app. You’ll practice event handling, conditional rendering, and managing complex states with arrays and objects. By the end of this section, you’ll have a deep understanding of how to handle user interactions in React.

4. Meme Generator Project
   Fetch data from APIs and use React’s useState and useEffect hooks. You’ll create a meme generator that dynamically loads and customizes meme images, giving you experience with data fetching and controlled components.

5. Tenzies Game
   Build a dice-rolling game that lets users roll, hold, and match dice to win. This project is great for practicing component styling, conditional logic, and game mechanics in React.

6. Assembly Endgame Project
   End the course with a word-guessing game that challenges your ability to plan and implement more advanced features, including accessibility improvements, state sharing, and interactive UI components.

The course wraps up with tips and tools to supercharge your development environment, including VS Code extensions and React developer tools that streamline debugging and productivity.

Conclusion

Ready to take your first step into the world of modern React? Check out the course on the freeCodeCamp.org YouTube channel (16-hour watch).

Source: freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More