Who is this course for?

This course is ideal for beginner to intermediate web developers who want to learn React and build modern front-end applications. It is also suitable for developers familiar with JavaScript who want to transition into component-based frameworks or enhance their front-end development skills.

How long does it take to complete the course?

The course takes approximately 3 hours to complete, making it a concise yet practical learning experience that can be completed in a short time while still covering essential React concepts and hands-on project work.

Does this course include practical projects?

Yes, the course includes a hands-on project where you build an anime search application. This project helps reinforce concepts like component structure, API integration using Axios, controlled inputs, and state management, giving you real-world development experience.

Can I preview a course before enrolling?

Yes, you can preview the first video and view the syllabus before you enroll. You must purchase the course to access content not included in the preview.

When will I have access to the lectures and assignments?

If you decide to enroll in the course before the session start date, you will have access to all of the lecture videos and readings for the course. You’ll be able to submit assignments once the session starts.

What will I get when I enroll?

Once you enroll and your session begins, you will have access to all videos and other resources, including reading items and the course discussion forum. You’ll be able to view and submit practice assessments, and complete required graded assignments to earn a grade and a Course Certificate.

When will I receive my Course Certificate?

If you complete the course successfully, your electronic Course Certificate will be added to your Accomplishments page - from there, you can print your Course Certificate or add it to your LinkedIn profile.

Why can’t I audit this course?

This course is currently available only to learners who have paid or received financial aid, when available.

Is financial aid available?

Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.

Modern React Foundations 2026: A Practical Developer Guide

Économisez sur les compétences qui vous font briller avec 40 % de réduction sur 3 mois de Coursera Plus. Économisez maintenant

Ce cours n'est pas disponible en Français (France)

Nous sommes actuellement en train de le traduire dans plus de langues.

Modern React Foundations 2026: A Practical Developer Guide

Instructeur : Packt - Course Instructors

Inclus avec

5 modules

Obtenez un aperçu d'un sujet et apprenez les principes fondamentaux.

niveau Débutant

Expérience recommandée

5 heures à compléter

Planning flexible

Apprenez à votre propre rythme

5 modules

Obtenez un aperçu d'un sujet et apprenez les principes fondamentaux.

niveau Débutant

Expérience recommandée

5 heures à compléter

Planning flexible

Apprenez à votre propre rythme

Ce que vous apprendrez

Understand the fundamentals of React, including components, JSX, and rendering
Learn how to manage state and handle events using React’s state management system.
Work with React hooks like useState and useEffect to manage side effects.
Build a dynamic, practical project that interacts with APIs, manages data, and implements user-friendly interfaces.

Compétences que vous acquerrez

Catégorie : Javascript
Catégorie : Front-End Web Development
Catégorie : React.js
Catégorie : HTML and CSS
Catégorie : Code Reusability
Catégorie : Data Sharing

Outils que vous découvrirez

Catégorie : UI Components
Catégorie : JavaScript Frameworks
Catégorie : Application Programming Interface (API)
Catégorie : Cascading Style Sheets (CSS)

Détails à connaître

Certificat partageable

Ajouter à votre profil LinkedIn

Récemment mis à jour !

mai 2026

Évaluations

6 devoirs

Enseigné en Anglais

Découvrez comment les employés des entreprises prestigieuses maîtrisent des compétences recherchées

En savoir plus sur Coursera pour les affaires

logos de Petrobras, TATA, Danone, Capgemini, P&G et L'Oreal

Il y a 5 modules dans ce cours

This course features Coursera Coach!

A smarter way to learn with interactive, real-time conversations that help you test your knowledge, challenge assumptions, and deepen your understanding as you progress through the course. In this beginner-friendly course, you’ll build a solid foundation in React, mastering key concepts like components, JSX, props, state management, and hooks (useState, useEffect). You’ll also learn to structure React projects efficiently and apply best practices. The course includes hands-on experience with a real-world project: a dynamic anime search app. You'll learn to fetch and display data from APIs, manage state, and build reusable components. As you progress, you'll explore CSS Modules for styling, handling error/loading states, and creating smooth user experiences. Ideal for aspiring developers, this course requires no prior React experience and provides you with the necessary tools to build dynamic web applications. By the end of the course, you will be able to create your own React projects, work with APIs, manage state, and implement reusable components.

In this module, we will introduce the course and lay out the goals of your React journey. You'll set up your development environment and create your first React project, as well as dive into React's fundamental concepts, such as components and project structure.

Inclus

8 vidéos1 lecture

In this section, we will explore JSX, the syntax extension that allows you to write HTML-like code within JavaScript. You'll learn how to structure JSX effectively, handle dynamic data rendering, and apply styles to your components, setting the foundation for building sophisticated UIs.

Inclus

7 vidéos1 devoir

In this module, we will explore props—React’s way of passing data between components. You'll gain practical experience by implementing dynamic components and managing data flow using props, creating modular, reusable elements in your applications.

Inclus

8 vidéos1 devoir

This section will cover the concept of state in React, which allows your components to change and re-render dynamically. You'll learn how to use React’s useState hook to manage state in functional components, enabling you to create more interactive user interfaces.

Inclus

5 vidéos1 devoir

In this module, we will guide you through building a practical project—a dynamic anime search application. You’ll implement various React features like state management, event handling, and API integration, while also applying best practices in component structure and styling. By the end of the module, you’ll have a fully functional React project with real-time user interaction and API data fetching.

Inclus

22 vidéos3 devoirs

22 vidéosTotal 87 minutes

Project Overview3 minutes
Talk About the Components!1 minute
SearchInput Component8 minutes
Anime Component4 minutes
AnimeList Component5 minutes
Anime API and axios2 minutes
Talk More About Search2 minutes
Search Function4 minutes
SearchInput Props2 minutes
Controlled Inputs4 minutes
Consume the API Response6 minutes
Cannot Mutate State7 minutes
Add to Favorites4 minutes
Remove from Favorites5 minutes
Loading Component4 minutes
CSS Modules4 minutes
Loading and Error States4 minutes
Add Loading and Error to JSX5 minutes
Yet Another Issue!2 minutes
useEffect Hook in Detail8 minutes
The Initial Search4 minutes
A Quick Change1 minute

3 devoirsTotal 90 minutes

Full Course Practice Assessment15 minutes
Building a Practical Project - Assessment15 minutes
Full Course Assessment60 minutes

Instructeur

Packt - Course Instructors

Packt

1 857 Cours514 430 apprenants

Offert par

Packt

En savoir plus sur Software Development

Statut : Essai gratuit
Packt
React Foundations & Core Frontend Development
Cours
Statut : Essai gratuit
Packt
React Foundations & Core Concepts
Cours
Statut : Essai gratuit
Packt
React Fundamentals and Modern Development Setup
Cours
Packt
React JS Portfolio Builder 2026 - Hands-On Beginner Workshop
Cours

Pour quelles raisons les étudiants sur Coursera nous choisissent-ils pour leur carrière ?

Felipe M.

Étudiant(e) depuis 2018

’Pouvoir suivre des cours à mon rythme à été une expérience extraordinaire. Je peux apprendre chaque fois que mon emploi du temps me le permet et en fonction de mon humeur.’

Jennifer J.

Étudiant(e) depuis 2020

’J'ai directement appliqué les concepts et les compétences que j'ai appris de mes cours à un nouveau projet passionnant au travail.’

Larry W.

Étudiant(e) depuis 2021

’Lorsque j'ai besoin de cours sur des sujets que mon université ne propose pas, Coursera est l'un des meilleurs endroits où se rendre.’

Chaitanya A.

’Apprendre, ce n'est pas seulement s'améliorer dans son travail : c'est bien plus que cela. Coursera me permet d'apprendre sans limites.’

Foire Aux Questions

React is a popular JavaScript library used for building dynamic and interactive user interfaces, particularly for web applications. It is highly relevant in modern web development because it enables developers to create reusable components, manage application state efficiently, and build scalable front-end architectures that power many of today’s high-performance websites and apps.

This course provides a comprehensive introduction to React by covering its core concepts such as components, JSX, props, and state. It also includes hands-on learning through building a practical anime search project, where learners will integrate APIs, manage data, and handle real-world application scenarios.

After completing this course, you will be able to build functional React applications from scratch, create reusable components, manage state using hooks like useState and useEffect, and integrate external APIs to fetch and display data. You will also gain the ability to structure projects effectively and handle user interactions in modern web apps.