Packt

React Basics and Initial Projects

Packt

React Basics and Initial Projects

Included with Coursera Plus

Gain insight into a topic and learn the fundamentals.
Beginner level

Recommended experience

1 week to complete
at 10 hours a week
Flexible schedule
Learn at your own pace
Gain insight into a topic and learn the fundamentals.
Beginner level

Recommended experience

1 week to complete
at 10 hours a week
Flexible schedule
Learn at your own pace

What you'll learn

  • Learn how to create React components and build dynamic UIs with JSX.

  • Understand React’s state management system and how to update state efficiently.

  • Master event handling, conditional rendering, and list rendering in React.

  • Implement React best practices for building interactive and maintainable web applications.

Details to know

Shareable certificate

Add to your LinkedIn profile

Recently updated!

May 2026

Assessments

11 assignments

Taught in English

See how employees at top companies are mastering in-demand skills

 logos of Petrobras, TATA, Danone, Capgemini, P&G and L'Oreal

Build your subject-matter expertise

This course is part of the The Complete React 19 Developer Course (incl. Next.js 16) Specialization
When you enroll in this course, you'll also be enrolled in this Specialization.
  • Learn new concepts from industry experts
  • Gain a foundational understanding of a subject or tool
  • Develop job-relevant skills with hands-on projects
  • Earn a shareable career certificate

There are 10 modules in this course

In this module, we will introduce the key concepts of React 19, including setting up your project with Vite. You will learn how to create your first React component, write JSX markup, and integrate JavaScript into JSX. This module also covers the importance of styling and passing props within components.

What's included

13 videos2 readings

In this module, we will revisit the fundamentals of JSX and recap its syntax, focusing on effective usage within React projects. You will learn about common mistakes developers make when using JSX and how to avoid them by applying best practices.

What's included

2 videos1 assignment

In this module, we will guide you through the Cambridge Rentals project, focusing on building key components like the header, footer, and property list. You will learn how to create dynamic content and structure your React app for future scalability.

What's included

11 videos1 assignment

In this module, we will explore how to add interactivity to your React app by responding to user events. You will learn how to manage state, handle events efficiently, and apply best practices to manage complex event interactions.

What's included

10 videos1 assignment

In this module, we will review the major concepts of adding interactivity in React, including common mistakes and how to avoid them. You will learn about the best practices for maintaining clean, efficient, and manageable interactivity.

What's included

1 video1 assignment

In this module, we will guide you through building a to-do list app, from setting up the file structure to rendering tasks dynamically. You will learn to implement task management features like adding, editing, deleting, and making changes persistent using localStorage.

What's included

10 videos1 assignment

In this module, we will introduce React Reducer and explain its role in state management. You will learn how to create a reducer function and understand when it's appropriate to use it for managing complex state logic in your React applications.

What's included

2 videos1 assignment

In this module, we will review common mistakes made while using React Reducer and share best practices to avoid them. You will also learn how to apply these best practices to effectively manage complex state in React applications.

What's included

1 video1 assignment

In this module, we will walk you through the UK Driving Test project, showing how to apply React Reducer to manage the state. You will learn to structure components for quiz functionality, including question navigation and progress tracking.

What's included

12 videos1 assignment

In this module, we will introduce React Context and show how it simplifies state management by avoiding prop drilling. You will learn how to implement React Context in a real-world application, such as a to-do list app, to handle global state more efficiently.

What's included

2 videos1 reading3 assignments

Earn a career certificate

Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.

Instructor

Packt - Course Instructors
Packt
1,778 Courses511,404 learners

Offered by

Packt

Explore more from Software Development

Why people choose Coursera for their career

Felipe M.

Learner since 2018
"To be able to take courses at my own pace and rhythm has been an amazing experience. I can learn whenever it fits my schedule and mood."

Jennifer J.

Learner since 2020
"I directly applied the concepts and skills I learned from my courses to an exciting new project at work."

Larry W.

Learner since 2021
"When I need courses on topics that my university doesn't offer, Coursera is one of the best places to go."

Chaitanya A.

"Learning isn't just about being better at your job: it's so much more than that. Coursera allows me to learn without limits."

Frequently asked questions