Packt

React State Management, Effects & Custom Hooks

Packt

React State Management, Effects & Custom Hooks

Included with Coursera Plus

Gain insight into a topic and learn the fundamentals.
Intermediate 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.
Intermediate level

Recommended experience

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

What you'll learn

  • Efficiently manage state using React Context and custom hooks.

  • Build professional React projects like portfolio websites with dark/light mode toggle.

  • Master the use of React's useEffect for managing side effects.

  • Implement advanced state management solutions with React useRef for optimal performance.

Details to know

Shareable certificate

Add to your LinkedIn profile

Recently updated!

May 2026

Assessments

12 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 review common mistakes and best practices when using React Context to manage state. You'll learn how to avoid pitfalls and implement efficient state management using React Context. By the end of this module, you will have a strong understanding of how to use React Context effectively in your projects.

What's included

1 video2 readings1 assignment

In this module, we will walk through the process of building a professional portfolio website with dark/light mode functionality. We'll cover the use of React Context to manage the theme state and ensure it persists across user sessions. This project will help you understand component structure, styling, and dynamic theming in React.

What's included

22 videos1 assignment

In this module, we will explore the use of React Refs for managing DOM references and their importance in React applications. You'll learn how to create a timer, access DOM nodes directly, and implement best practices for DOM manipulation using Refs. By the end, you will have hands-on experience using Refs in various scenarios.

What's included

5 videos1 assignment

In this module, we will review the common mistakes made while using React Refs and provide best practices for improving your implementation. We will also discuss performance optimization techniques to ensure that Refs are used efficiently in your React applications. This module helps you refine your understanding of React Refs.

What's included

1 video1 assignment

In this module, we will create a fun Card Flip Game project, utilizing the useRef hook to manage the flipping logic and game state. You'll learn how to organize components, handle game state, and integrate sound effects to enhance user interaction. This hands-on project will deepen your understanding of React hooks and Refs.

What's included

14 videos1 assignment

In this module, we will introduce the useEffect hook and demonstrate its role in handling side effects in React. You will learn how to manage dependencies, implement cleanup functions, and optimize the performance of your application by handling side effects efficiently. This module is essential for managing external data and interactions in React applications.

What's included

5 videos1 assignment

In this module, we will review the common mistakes developers make when using the useEffect hook and discuss best practices to optimize its usage. We’ll also cover performance optimization strategies to ensure your React app runs smoothly. This module is perfect for fine-tuning your useEffect implementation.

What's included

1 video1 assignment

In this module, we will guide you through building a weather app that fetches and displays real-time weather data using the useEffect hook. You'll learn how to structure the project, manage side effects, and handle asynchronous data fetching. This hands-on project will enhance your skills in using useEffect for dynamic applications.

What's included

12 videos1 assignment

In this module, we will create a multi-language story collection app that uses React Context for language management. You'll learn how to build dynamic components, structure your project, and integrate a backend service for data storage. This project will give you practical experience in developing internationalized React apps with state management.

What's included

15 videos1 assignment

In this module, we will build a feature-rich Kanban board, similar to Trello, that incorporates drag-and-drop functionality and uses the useEffect hook for dynamic state management. You’ll learn how to manage columns, tasks, and user interactions, while ensuring the app’s state persists across page reloads. This project will sharpen your React and hook-based development skills.

What's included

15 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