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

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

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

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

React Basics and Initial Projects

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

О курсе

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. This course is designed to provide a comprehensive introduction to React 19, focusing on essential concepts like JSX, components, and props, while also diving into state management and interactivity. You will learn through both theoretical concepts and practical applications by building real-world projects such as a to-do list app and Cambridge Rentals. With hands-on activities, this course encourages you to practice each new concept immediately. Throughout the modules, you'll start with React fundamentals, including JSX, components, and props, and progress to more complex topics like state management, event handling, and conditional rendering. The course includes professional projects where you will implement what you've learned in structured environments, enhancing your skills with real-world applications. These projects provide a thorough understanding of React and how to build dynamic, interactive applications. This course is suitable for beginners who are eager to explore the React ecosystem and for those looking to enhance their web development skills. While prior knowledge of HTML, CSS, and JavaScript will be helpful, it is not mandatory. We also recommend some experience with basic programming concepts. By the end of the course, you will be able to build interactive React applications, create and export components, manage state, and utilize React’s powerful features for dynamic rendering. You will also be able to apply your knowledge to develop real-world projects like rental websites and task management apps.

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

React.jsContext ManagementEvent-Driven ProgrammingFront-End Web DevelopmentScalabilityJavascriptCascading Style Sheets (CSS)Web ApplicationsUI Components

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

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

01React 19 Setup & JSX15 материалов

React 19 Setup & JSX

Introduction to the SpecializationВидеоIntroduction to the course 'React Basics and Initial Projects'ЧтениеFull Course ResourcesЧтениеHow to Setup React 19 with ViteВидео

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

Packt - Course Instructors

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

React Basics and Initial Projects
В каталоге вашей программы

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

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

Начать на Coursera

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

Обучение на Coursera

≈ 13.5 ч

10 модулей

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

Субтитры: Арабский, Французский, Итальянский, Бразильский португальский, Корейский, Индонезийский, Испанский, Японский

Часть программы вашего университета
Your First React ComponentВидео
Exporting React ComponentsВидео
Building UIs with JSX: Writing Markup in ReactВидео
Integrating JavaScript in JSX with Curly BracesВидео
Styling React ComponentsВидео
Working with Props in React ComponentsВидео
Conditional Rendering 1Видео
Conditional Rendering 2Видео
Rendering ListsВидео
Keeping Components PureВидео
Purity Props ExampleВидео
02JSX Review - Common mistakes - Best practices4 материалов

JSX Review - Common mistakes - Best practices

JSX ReviewВидеоCommon Mistakes - Best PracticesВидеоMastering JSX Best Practices in React ComponentsDIALOGUEJSX Review - Common mistakes - Best practices - AssessmentЗадание
03Professional Project - Cambridge Rentals13 материалов

Professional Project - Cambridge Rentals

IntroductionВидеоComponent TreeВидеоBuilding the File StructureВидеоBuild the HeaderВидеоBuild the TitleВидеоBuild the FooterВидеоBuild the List of PropertiesВидеоBuild the PropertyTypeLabel ComponentВидеоBuild the PropertyBanner ComponentВидеоBuild the IconWithText ComponentВидеоBuild the PropertyAttribute ComponentВидеоBuilding & Reusing React Components: Property DetailsDIALOGUEProfessional Project - Cambridge Rentals - AssessmentЗадание
04Adding Interactivity12 материалов

Adding Interactivity

Responding to EventsВидеоPassing Event Handlers from a Parent to a ChildВидеоUnderstanding Event PropagationВидеоPreventing Default BehaviourВидеоReact StateВидеоState Batching + Updating State Using a Value vs FunctionВидеоUpdating Objects in StateВидеоUpdating Arrays in StateВидеоCreate a Shopping CartВидеоTrigger => Render => VirtualDOM => CommitВидеоReact State, Event Handling, and Immutability in a Shopping Cart AppDIALOGUEAdding Interactivity - AssessmentЗадание
05Adding Interactivity Review - Common mistakes - Best practices3 материалов

Adding Interactivity Review - Common mistakes - Best practices

Adding Interactivity - ReviewВидеоReviewing Interactivity in React: Event Handling and StateDIALOGUEAdding Interactivity Review - Common mistakes - Best practices - AssessmentЗадание
06Professional Project: To Do List App12 материалов

Professional Project: To Do List App

IntroductionВидеоComponent TreeВидеоBuilding the File StructureВидеоRendering TasksВидеоBuilding the TaskControls ComponentВидеоBuilding the TaskForm ComponentВидеоToggle Task CompletionВидеоDelete TasksВидеоEdit TasksВидеоMake Changes Persistent Using localStorageВидеоImplementing Local Storage Persistence in a React To Do AppDIALOGUEProfessional Project: To Do List App - AssessmentЗадание
07React Reducer4 материалов

React Reducer

IntroductionВидеоCreate the Reducer FunctionВидеоCentralizing State Logic with React ReducersDIALOGUEReact Reducer - AssessmentЗадание
08React Reducer Review - Common mistakes and best practices3 материалов

React Reducer Review - Common mistakes and best practices

React Reducer Review - Common mistakes and best practicesВидеоReviewing Best Practices with React ReducersDIALOGUEReact Reducer Review - Common mistakes and best practices - AssessmentЗадание
09Professional Project: UK Driving Test - React Reducer14 материалов

Professional Project: UK Driving Test - React Reducer

IntroductionВидеоComponent TreeВидеоBuilding the File StructureВидеоManaging Quiz State with useReducerВидеоQuestionView: QuestionHeaderВидеоQuestionView: QuestionTextВидеоQuestionView: AnswerOptionsВидеоQuestionView: MediaDisplayВидеоQuestionView: NavigationControlsВидеоProgressBarВидеоAppBannerВидеоResultViewВидеоBuilding and Integrating a Dynamic Progress Bar with useReducerDIALOGUEProfessional Project: UK Driving Test - React Reducer - AssessmentЗадание
10React Context7 материалов

React Context

Introduction to React ContextВидеоApplying React Context to To-Do List AppВидеоConclusion to the Course 'React Basics and Initial Projects'ЧтениеUnderstanding and Applying React Context vs Prop DrillingDIALOGUEReact Context - AssessmentЗаданиеFull Course Practice AssessmentЗаданиеFull Course AssessmentЗадание