К содержимому
learnspaceYOUR NEXT CHAPTER
ПРОСТРАНСТВО ОБУЧЕНИЯ
ГлавнаяКаталог курсовМоё обучениеCoursera

Знания без границ

Учитесь у лучших университетов и компаний мира.

Открыть Coursera
Интеграция
Пространство университета
Моё пространствоСтраница курса
↵
ЯЛичный кабинетСтудент
© 2026 LearnSpaceКаждый день — возможность узнать больше.Помощь
Master React, Redux and Next.js - The Practical Course · LearnSpace
Назад в каталог
courseraПрограммирование

Master React, Redux and Next.js - The Practical Course

Курс от Packt
Средний≈ 19.2 чАнглийский
О курсеНавыкиПрограммаПреподаватели

О курсе

This course equips you with in-depth React, Redux, and Next.js skills. Build dynamic apps, handle state efficiently, optimize with React Hooks, and deploy using Vercel. Real-world projects will prepare you for modern web development challenges. Explore the power of React, Redux, and Next.js in this course designed for developers eager to dive into modern web development. Starting with the essentials of React, you'll learn to build interactive UIs and use hooks to manage component state. The course then moves into Redux for managing global state and dives deep into advanced concepts like reducers and custom hooks. Next, you’ll explore the scalability of Next.js, from static site generation to server-side rendering, and how to deploy your apps using platforms like GitHub Pages and Vercel. With practical projects like a Task Manager, Blog Website, and Match the Pairs Game, you'll gain the hands-on experience needed to create and optimize complex web applications. The course also emphasizes performance optimization and responsive design, teaching you how to leverage React’s capabilities to build fast, reliable applications. By the end of the course, you'll be confident in your ability to create efficient, scalable web apps using React and Next.js, as well as deploy them to production environments. With a comprehensive understanding of state management and server-side rendering, you’ll be well-equipped to tackle real-world development challenges. Plus, you’ll be prepared to build apps that provide a seamless user experience, all while using industry-standard technologies. This course is ideal for developers with some experience in JavaScript or front-end development. If you’re eager to advance your skills in React, Redux, and Next.js, and build real-world applications, this course is for you. Whether you're a junior developer aiming to level up or a self-taught developer looking for structure, this course will provide the tools and knowledge you need to build powerful web apps. Familiarity with HTML, CSS, and JavaScript basics is recommended. Learn React, Redux, and Next.js through practical, hands-on projects. From building dynamic UIs with React components to managing global state with Redux and deploying scalable apps using Next.js, this course covers it all. You’ll gain skills that are immediately applicable in modern web development environments. This course is based on Master React, Redux and Next.js - The Practical Course, by Ahmed Elsakka. This video is licensed and distributed by Packt. All rights reserved. Packt is one of the world's most prolific publishers of cutting-edge technical content. For over two decades we've made it our mission to curate and publish the knowledge of only the very best technical experts. We focus on real-world courses that help our customers get the job done, with coverage that extends across a wide range of established and cutting-edge technical topics. If you're an individual or an organisation that embraces learning by doing, Packt is the perfect fit for you.

Навыки, которые вы освоите

Web ApplicationsApplication DevelopmentReact ReduxJest (JavaScript Testing Framework)Full-Stack Web DevelopmentEvent-Driven ProgrammingUI ComponentsReact.jsFront-End Web DevelopmentWeb DevelopmentJavaScript FrameworksWeb Development ToolsJavascriptWeb FrameworksReact NativeGraphQLApplication DeploymentHTML and CSSCascading Style Sheets (CSS)User Interface (UI)

Программа курса

19 модулей · 155 учебных материалов

01Introduction3 материалов

Getting Started with React: From Concepts to Setup

What is React?ВидеоEnvironment SetupВидеоExplaining React Component ArchitectureDIALOGUE
02React Basics17 материалов

Building Your First React Application and Components

Учитесь у экспертов

Packt - Course Instructors

Преподаватель курса

Master React, Redux and Next.js - The Practical Course
В каталоге вашей программы

Инвестируйте в себя

Новые знания — в удобное для вас время.

Начать на Coursera

Обучение откроется на Coursera
в новой вкладке

Обучение на Coursera

≈ 19.2 ч

19 модулей

Язык: Английский

Часть программы вашего университета
Creating React ProjectВидео
Creating the First React ComponentВидео
Function ComponentsВидео
The App Component and Other Generated FilesВидео
React JSXВидео
Adding StylesВидео
Displaying DataВидео
Conditional RenderingВидео
More on Displaying Lists in ReactВидео
Event HandlingВидео
PropsВидео
Project 1 - Profile CardВидео
Props ValidationВидео
StateВидео
Stale StateВидео
Understanding React Component StructureDIALOGUE
Foundations of Building with ReactЗадание
03Project - Task Manager8 материалов

Constructing a Task Manager Application with React

Project OverviewВидеоTaskList ComponentВидеоTaskInput ComponentВидеоApp ComponentВидеоAdding Event HandlingВидеоStylingВидеоDebugging a Task Manager UI BugDIALOGUEBuilding a Task Manager Application with ReactЗадание
04React Hooks9 материалов

Mastering State Management and Performance Optimization with React Hooks

Introduction to React HooksВидеоContext HookВидеоReducer HookВидеоProject 2 Follow Up: Using ReducersВидеоuseRefВидеоuseMemoВидеоCustom HooksВидеоExploring React Hook PatternsDIALOGUEModern React Component LogicЗадание
05Side Effects in React6 материалов

Mastering Side Effects in React with useEffect

Introduction to Side EffectsВидеоuseEffect HookВидеоuseEffect with DependenciesВидеоCleanup FunctionsВидеоResolving Unexpected State Updates in a React ComponentDIALOGUEApplying Side Effects with useEffect in ReactЗадание
06Project - SpaceX Launches Tracker5 материалов

Building and Enhancing a SpaceX Launch Tracker Web App

Creating LaunchTracker ComponentВидеоAdding PaginationВидеоStyling the WebsiteВидеоUnderstanding React State and PaginationDIALOGUEBuilding a SpaceX Launch Tracker in ReactЗадание
07Testing in React8 материалов

Building Reliable React Applications Through Effective Testing

Introduction to TestingВидеоIntroduction to JestВидеоWriting the First React Component TestВидеоMatchers in JestВидеоMockingВидеоTest SuitesВидеоDebugging a Failing Test in ReactDIALOGUEFoundations of Testing in React ApplicationsЗадание
08Redux5 материалов

Mastering State Management with Redux and Redux Toolkit

Introduction to ReduxВидеоRedux FundamentalsВидеоRedux ToolkitВидеоExploring Redux ConceptsDIALOGUEState Management Using Redux and Redux Toolkit in ReactЗадание
09Debugging and Deploying React Applications5 материалов

Mastering Debugging and Deployment in React

React Development ToolsВидеоDeploying to Github PagesВидеоDeploying With VercelВидеоDebugging a React App Before DeploymentDIALOGUEDeploying and Debugging React ApplicationsЗадание
10Project - Match the Pairs Game10 материалов

Building a Dynamic Match the Pairs Game in React

Match the Pairs Game OverviewВидеоCreate the Project and Basic StylingВидеоStart/Reset the Game TimerВидеоShuffle the CardsВидеоThe Card ComponentВидеоStyling the CardВидеоImplementing the Game LogicВидеоReset the Game After WinningВидеоExploring Game Logic in ReactDIALOGUEBuilding a Match Pairs Game in ReactЗадание
11Project - Painter Application8 материалов

Building a Dynamic Painter Application with React and Canvas

Painter - Project OverviewВидеоCreating the CanvasВидеоStyling the CanvasВидеоImplementing the Drawing FunctionalityВидеоCreating the Menu ComponentВидеоStyling the MenuВидеоDebugging a Canvas Drawing IssueDIALOGUEBuilding a Painter Application with React and CanvasЗадание
12Using Tailwind CSS with React15 материалов

Building Responsive UIs with Tailwind CSS and React

What is Tailwind CSS?ВидеоMargin and PaddingВидеоColors in TailwindВидеоFont Size and ColorВидеоBackground ColorВидеоShadowsВидеоGridsВидеоHover EventВидеоSetting Up Tailwind CSS with ReactВидеоProject 4 - Card Gallery Project OverviewВидеоCreating the Card ComponentВидеоCreating the Cards GalleryВидеоFinal TouchesВидеоUnderstanding Tailwind CSS Utility ClassesDIALOGUETailwind CSS Essentials for Responsive Web DesignЗадание
13GraphQL with React7 материалов

Mastering GraphQL Integration in React with Apollo Client

Introduction to GraphQLВидеоGitHub GraphQL APIВидеоCreating a GitHub Personal TokenВидеоSetting Up Apollo ClientВидеоRetrieving GitHub User Repositories via GraphQLВидеоDebugging a GraphQL Query in a React AppDIALOGUEGitHub GraphQL Integration with ReactЗадание
14React the Legacy Way: Class Components5 материалов

Mastering React Class Components: Structure, State, and Lifecycle

Introduction to Class ComponentsВидеоManaging State in Class ComponentsВидеоClass Components Life-Cycle MethodsВидеоExploring React Class Component LifecycleDIALOGUEReact Class Components and Lifecycle MethodsЗадание
15Project - Weather Dashboard Using Class Components5 материалов

Building a Dynamic Weather Dashboard with React and OpenWeather API

Fetching the Weather Data via OpenWeather APIВидеоWriting the JSX CodeВидеоImplementing the Event HandlersВидеоDebugging a Weather Dashboard ComponentDIALOGUEBuilding a Weather Information App in ReactЗадание
16React Router7 материалов

Mastering Navigation in React Applications with React Router

Introduction to React RouterВидеоNavigation with NavLinkВидеоNested RoutingВидеоNavigating ProgrammaticallyВидеоURL ParametersВидеоExploring React Router ConceptsDIALOGUEFundamentals of React Router UsageЗадание
17Project - Online Shopping Website9 материалов

Building a Fully Functional Online Shopping Platform

Project OverviewВидеоSetting Up the ProjectВидеоCreate the JSON DataВидеоSetting Up React RouterВидеоCreating the Home PageВидеоCreating the Product Detail PageВидеоCreating the Profile PageВидеоResolving Navigation Issues in a React ProjectDIALOGUEBuilding an Online Shopping Platform with ReactЗадание
18Using Next.js11 материалов

Mastering Next.js: From Setup to Deployment

Introduction to Next.jsВидеоCreating a Project with Next.jsВидеоStylingВидеоFonts OptimizationВидеоOptimizing ImagesВидеоLayouts and PagesВидеоNavigation with LinksВидеоCreating a Database and DeployingВидеоFetching Data from the DatabaseВидеоUnderstanding Next.js Page StructureDIALOGUEBuilding Applications with Next.jsЗадание
19Project - Building a Blog Website with Next.js12 материалов

Building a Dynamic Blog with Next.js and Supabase

Set Up PostgreSQL Database on SupabaseВидеоConnecting to the Database with PrismaВидеоCreating the Posts APIВидеоCreating the Posts PageВидеоStyling the Application with Tailwind CSSВидеоDeploying the Application to VercelВидеоCreate an API for Adding PostsВидеоCreate the "Add Post" PageВидеоCreate a New Deployment on VercelВидеоAdd Layout to Improve the CodeВидеоTroubleshooting a Blog Deployment on VercelDIALOGUEThe Master React, Redux and Next.js - The Practical Course Final AssessmentЗадание