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

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

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

Открыть Coursera
Интеграция
Пространство университета
Моё пространствоСтраница курса
↵
ЯЛичный кабинетСтудент
© 2026 LearnSpaceКаждый день — возможность узнать больше.Помощь
Advanced React Projects and Ecommerce Development · LearnSpace
Назад в каталог
courseraIT и технологии

Advanced React Projects and Ecommerce Development

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

О курсе

Updated in May 2025. This course now 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. This advanced React course is designed for developers who want to deepen their understanding of React while working on hands-on projects. The journey begins with building a basic calculator in React, which introduces fundamental concepts like JSX, functional components, and React State Hooks. You’ll explore how to handle events, pass parameters in callbacks, and debug applications, providing a strong foundation for more complex projects. Along the way, you’ll master the use of props and state to manage data flow between components, a crucial skill in React development. The next project is a Connect-4 clone, where you’ll apply your React knowledge to build an interactive game. This project emphasizes component design, event handling, and dynamic styling. You'll explore advanced concepts such as lifecycle methods, state management with hooks, and conditional rendering. Additionally, you’ll learn to implement a simple AI for a smart computer player and deploy the project using platforms like Netlify and Surge. The final project focuses on building a full-featured ecommerce site. Starting with setting up a JSON server, you’ll fetch data, render product lists, and use React Router to create dynamic pages. Throughout the project, you’ll refine your skills in managing state and props, styling components with CSS and Styled Components, and handling errors in API calls. You’ll also implement key ecommerce functionalities like a shopping basket, checkout process, and order confirmation, ensuring you’re well-prepared to build scalable ecommerce applications using React. This course is perfect for intermediate to advanced developers looking to enhance their React skills. Ideal for those aiming to build scalable, interactive web applications, with a focus on project-based learning. Prior experience with basic React and JavaScript is recommended.

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

React.jsCode ReusabilityData ManagementJSONCascading Style Sheets (CSS)User Interface (UI)Application DeploymentWeb DevelopmentDebuggingUI ComponentsWeb ApplicationsEvent-Driven ProgrammingJavaScript FrameworksJavascript

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

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

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

ReactJS

Introduction to the Course 'Advanced React Projects and Ecommerce Development'ЧтениеFull Specialization ResourcesЧтениеSkills RequiredВидеоWhat Is React?Видео

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

Packt - Course Instructors

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

Advanced React Projects and Ecommerce Development
В каталоге вашей программы

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

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

Начать на Coursera

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

Обучение на Coursera

≈ 13.5 ч

4 модулей

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

Часть программы вашего университета
Understanding React and Virtual DOMDIALOGUE
02Project: Build a Calculator in React19 материалов

Project: Build a Calculator in React

Project OverviewВидеоHello, ReactВидеоTools NeededВидеоCode PenВидеоIntroduction to JSXВидеоFunctional Components in ReactВидеоWhy Components?ВидеоIntroduction to Props in ReactВидеоReact Components, Props, and CallbacksВидеоBuilding the Calculator VisualsВидеоEvents in ReactВидеоPassing Parameters in Callback FunctionsВидеоUsing React State HookВидеоImplementing the Calculator - DisplayВидеоImplementing the Calculator - OperatorsВидеоDebugging in ReactВидеоProject SummaryВидеоBuilding a Basic React CalculatorDIALOGUEAssessment 1Задание
03Project 2 - Build a Connect-4 Clone in React30 материалов

Project 2 - Build a Connect-4 Clone in React

Project Introduction - What We Will BuildВидеоTools NeededВидеоCreating the Game BoardВидеоGame Circle - EventВидеоPassing Props - Destructing - React ChildrenВидеоPassing Arguments to Click EventsВидеоInline StylingВидеоSquare to Circle ComponentВидеоGlobal StylingВидеоDynamic StylingВидеоDynamic ClassesВидеоHandling CallbacksВидеоUsing React State Hook (again)ВидеоUpdating the Player CircleВидеоInitializing the Game BoardВидеоReact Key PropertyВидеоStyling the Game Board - Header and FooterВидеоCalculating the WinnerВидеоDisplaying the WinnerВидеоDetermining a Draw ConditionВидеоReact Lifecycle EventsВидеоInitializing the GameВидеоSuggesting a Move - Implementing a Computer PlayerВидеоSmart Computer Player (Basic AI)ВидеоCSS VariablesВидеоConditional RenderingВидеоDeploy to NetlifyВидеоDeploy to SurgeВидеоProject SummaryВидеоDynamic Styling with ReactDIALOGUE
04Project 3 - Build an Ecommerce Site in React43 материалов

Project 3 - Build an Ecommerce Site in React

Project Introduction - What We Will BuildВидеоScaffolding the ProjectВидеоIntroduction to JSON ServerВидеоFetch APIВидеоStyling the StoreВидеоRendering the CategoriesВидеоBinding the ProductsВидеоRefactor the Fetch API CallВидеоDealing with Errors in Fetch APIВидеоTidy the Fetch API CallВидеоStyling the Product ListВидеоInstalling React RouterВидеоFixing the Key WarningВидеоReact Router - Detail PageВидеоFetch API - Get Product By IDВидеоProduct DescriptionВидеоIntroduction to Styled ComponentsВидеоStyled Components - Product DescriptionВидеоDangerously Set HTML (Yeah Really)ВидеоRefactor the CategoriesВидеоRefactor the LayoutВидеоRefactor the HomepageВидеоIntroduction to Context in ReactВидеоUseContext Hook and UseReducer Hook in ReactВидеоBasket LayoutВидеоImplementing the BasketВидеоImplementing Basket IconsВидеоImplementing Basket TotalВидеоFinishing the CheckoutВидеоCheckout - Fixing the StateВидеоImplementing the Order ConfirmationВидеоIntroduction to Local StorageВидеоImplementing Search ResultsВидеоBetter Searching with DebouncingВидеоValidating Forms in React - Part 1ВидеоValidating Forms in React - Part 2ВидеоValidating Forms in React - Part 3ВидеоValidating Forms in React - Part 4ВидеоProject SummaryВидеоConclusion to the Course 'Advanced React Projects and Ecommerce Development'ЧтениеAssessment 2ЗаданиеFull Course Practice AssessmentЗаданиеFull Course AssessmentЗадание