Главная страницаКатегория firebaseСоздавайте Веб-Приложения с Помощью React и Firebase

Создавайте Веб-Приложения с Помощью React и Firebase

Name: Создавайте Веб-Приложения с Помощью React и Firebase
Price: 12.5 USD
Rating: 4.8 (32 reviews)

Build Web Apps with React & Firebase

udemy

★4.8 (всего оценок - 32)

Продолжительность

23 ч 34 мин

Категория

Firebase

Количество уроков

222 Видео

Дата добавления

2 нояб. 2021 г., 15:23

Язык

Английский

Дата выхода

13 окт. 2021 г., 03:00

Дата обновления

29 апр. 2026 г., 13:16

Хотите уверенно создавать современные веб‑приложения? В этом курсе вы шаг за шагом освоите связку React + Firebase — один из самых востребованных и гибких технологических стеков для фронтенд‑разработки. Материал подойдёт как новичкам, так и тем, кто уже пробовал React и хочет систематизировать знания и прокачать навыки на реальных проектах.

Чему вы научитесь в этом курсе

Курс сфокусирован на практическом освоении React и его экосистемы, а также интеграции веб‑приложений с Firebase. Каждая тема сопровождается упражнениями и созданием функциональных мини‑проектов.

Основы React: от базовых концепций до уверенного применения

Понимание архитектуры React и его ключевых преимуществ.
Создание приложения с нуля с помощью create-react-app.
Построение интерфейсов из компонентов.
Работа с пропсами и состоянием.
Создание интерактивных элементов и обработка событий.

Хуки React и управление состоянием

Использование ключевых хуков: useState, useEffect, useParams, useHistory.
Понимание принципов реактивности.
Контекст и глобальное состояние с React Context API.
Работа со сложным состоянием через useReducer и редукторы.

Навигация и маршрутизация

Вы научитесь работать с React Router и создавать приложения, которые выглядят как многостраничные, хотя фактически являются SPA — одностраничными приложениями с плавной навигацией.

Практические проекты, которые войдут в ваше портфолио

В процессе обучения вы создадите 4 полноценных приложения:

Игра «Память» с динамическим состоянием.
Кулинарный сайт с системой рецептов.
Финансовый трекер с хранением данных.
Приложение для управления проектами с расширенной логикой.

Интеграция с Firebase

После освоения основ React вы перейдёте к созданию полнофункциональных веб‑приложений с backend‑возможностями, используя Firebase.

Firebase как серверная часть

Подключение Firebase к React‑проекту.
Использование Реaltime Database и Firestore.
Настройка аутентификации пользователей.
Загрузка файлов через Firebase Storage.

Деплой и публикация

Вы научитесь разворачивать свои веб‑сайты с помощью Firebase Hosting и публиковать их в интернете в несколько кликов.

Результат обучения

К концу курса вы будете уверенно работать с React и Firebase, понимать архитектуру современных SPA и сможете создавать полноценные веб‑приложения — от интерфейса до хранения данных и аутентификации. Все проекты, созданные на курсе, можно свободно добавлять в портфолио и демонстрировать работодателям.

Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум

Урок 1. 00:02:57
Welcome to the Course
Урок 2. 00:04:05
React at a Glance
Урок 3. 00:01:19
What You Should Already Know
Урок 4. 00:03:08
Environment Setup
Урок 5. 00:01:38
Using the Course Files
Урок 6. 00:05:08
Using React with a CDN
Урок 7. 00:04:40
Making a React Component
Урок 8. 00:03:51
JSX & Templates
Урок 9. 00:04:46
Template Expressions & Variables
Урок 10. 00:06:08
Click Events & Event Handlers
Урок 11. 00:03:57
Making a React Site (create-react-app)
Урок 12. 00:07:24
Project Structure Walkthrough
Урок 13. 00:04:36
Running the Application
Урок 14. 00:03:34
Using Images
Урок 15. 00:03:19
Using Stylesheets
Урок 16. 00:07:14
Why We Need State
Урок 17. 00:06:52
Using the useState Hook
Урок 18. 00:04:51
How State & Rendering Works
Урок 19. 00:08:19
Outputting Lists
Урок 20. 00:09:37
Using the Previous State
Урок 21. 00:06:54
Conditional Templates
Урок 22. 00:01:36
useState Limitations
Урок 23. 00:01:39
Using Mutliple Components
Урок 24. 00:05:31
Creating a Title Component
Урок 25. 00:05:52
Intro to Props
Урок 26. 00:03:48
React Fragments
Урок 27. 00:07:46
Children Prop (Making a Modal Component)
Урок 28. 00:04:56
Functions as Props
Урок 29. 00:02:29
CHALLENGE - Showing the Modal
Урок 30. 00:03:51
Portals
Урок 31. 00:06:54
CHALLENGE - Reusable Event List Component
Урок 32. 00:02:47
Class Components Overview
Урок 33. 00:03:10
Using Global Stylesheets
Урок 34. 00:06:38
Component Stylesheets
Урок 35. 00:03:21
Using Inline Styles
Урок 36. 00:02:37
Dynamic Inline Styles
Урок 37. 00:02:47
Conditional CSS Classes
Урок 38. 00:06:23
CSS Modules
Урок 39. 00:07:16
Forms & Labels in React
Урок 40. 00:06:17
The onChange Event
Урок 41. 00:05:36
Controlled Inputs
Урок 42. 00:06:21
Submitting Forms (onSubmit)
Урок 43. 00:06:36
Adding Events to the Event List
Урок 44. 00:06:33
Using the useRef Hook
Урок 45. 00:05:22
Select Boxes
Урок 46. 00:07:01
New Project & JSON Server
Урок 47. 00:08:19
Why We Need useEffect
Урок 48. 00:07:49
Fetching Data with useEffect
Урок 49. 00:09:25
The useEffect Dependency Array
Урок 50. 00:08:30
useCallback for Function Dependencies
Урок 51. 00:14:04
Creating a Custom Fetch Hook
Урок 52. 00:04:25
Adding a Loading/Pending State
Урок 53. 00:08:43
Handling Errors
Урок 54. 00:04:40
Why We Need a Cleanup Function
Урок 55. 00:05:45
Aborting Fetch Requests
Урок 56. 00:06:16
useEffect Gotcha - Infinite Loops
Урок 57. 00:05:43
Project Preview & Setup
Урок 58. 00:08:06
Setting up & Shuffling Cards
Урок 59. 00:04:19
Creating a Card Grid
Урок 60. 00:04:11
CHALLENGE - Creating a Card Component
Урок 61. 00:05:57
Making Card Choices
Урок 62. 00:07:15
CHALLENGE - Comparing Choices
Урок 63. 00:05:58
Adding a 'matched' Property to Cards
Урок 64. 00:08:58
Flipping Cards
Урок 65. 00:02:20
Flipping Animation (CSS)
Урок 66. 00:05:04
Making Cards "disabled"
Урок 67. 00:03:52
Finishing Touches
Урок 68. 00:05:40
Multi-Page React Sites
Урок 69. 00:06:59
React Router Setup
Урок 70. 00:06:03
Switch & Exact Match
Урок 71. 00:07:15
Links & Nav Links
Урок 72. 00:07:25
Fetching Data
Урок 73. 00:06:36
Route Parameters
Урок 74. 00:06:51
The useParams Hook
Урок 75. 00:05:41
Programmatic Redirects
Урок 76. 00:02:29
Redirect Component
Урок 77. 00:05:23
Query Parameters
Урок 78. 00:06:39
Project Preview & Setup
Урок 79. 00:06:19
Router & Pages Setup
Урок 80. 00:04:54
Making a Navbar Component
Урок 81. 00:04:41
Fetching Data
Урок 82. 00:09:46
Recipe List Component
Урок 83. 00:05:18
CHALLENGE - Fetching a Single Recipe
Урок 84. 00:05:04
Recipe Details Template
Урок 85. 00:08:41
Making a "Create Recipe" Form
Урок 86. 00:12:35
Adding Multiple Ingredients
Урок 87. 00:12:34
Making a POST Request
Урок 88. 00:03:43
CHALLENGE - Redirecting the User
Урок 89. 00:07:13
Making a Search Bar Component
Урок 90. 00:08:17
Search Results Page
Урок 91. 00:03:22
Finishing Touches
Урок 92. 00:02:36
Prop Drilling
Урок 93. 00:02:55
What is the Context API?
Урок 94. 00:07:35
Creating a Context & Provider
Урок 95. 00:03:40
Accessing Context Values
Урок 96. 00:05:49
Creating a Custom Context Hook
Урок 97. 00:13:58
Reducers & useReducer
Урок 98. 00:10:37
Making a Color Theme Selector
Урок 99. 00:12:23
Light & Dark Mode Selector
Урок 100. 00:06:41
Styling Light & Dark Modes
Урок 101. 00:03:32
What is Firebase?
Урок 102. 00:05:04
Firestore Databases
Урок 103. 00:07:11
Connecting to Firebase
Урок 104. 00:11:48
Fetching a Firestore Collection
Урок 105. 00:09:38
Fetching a Firestore Document
Урок 106. 00:05:53
Adding Firestore Data
Урок 107. 00:05:36
Deleting Firestore Data
Урок 108. 00:07:48
Real-Time Collection Data
Урок 109. 00:04:41
Updating Documents
Урок 110. 00:04:31
Real-Time Document Data
Урок 111. 00:03:18
Project Preview & Setup
Урок 112. 00:05:17
CHALLENGE - Creating Pages & Routes
Урок 113. 00:04:44
Creating a Navbar
Урок 114. 00:07:20
Making the Login Form
Урок 115. 00:04:55
CHALLENGE - Making the Signup Form
Урок 116. 00:03:49
Firebase Setup
Урок 117. 00:04:03
Firebase Authentication Setup
Урок 118. 00:11:15
Creating a Signup Hook
Урок 119. 00:09:10
Using the Signup Hook
Урок 120. 00:11:40
Creating an Auth Context
Урок 121. 00:06:08
Dispatching a Login Action
Урок 122. 00:06:32
Creating a Logout Hook
Урок 123. 00:04:49
Using the Logout Hook
Урок 124. 00:08:15
Adding Cleanup Functions
Урок 125. 00:04:49
Creating a Login Hook
Урок 126. 00:03:58
Using the Login Hook
Урок 127. 00:08:07
Conditionall Showing User Content
Урок 128. 00:09:29
Firebase Auth State Changes
Урок 129. 00:04:23
Waiting Until Auth is Ready
Урок 130. 00:06:01
Route Guarding
Урок 131. 00:12:15
Making a Transaction Form
Урок 132. 00:13:03
Creating a useFirestore Hook
Урок 133. 00:10:58
Adding Firestore Documents
Урок 134. 00:03:42
Firestore Timestamps
Урок 135. 00:09:37
Using the useFirestore Hook
Урок 136. 00:11:20
Creating a useCollection Hook
Урок 137. 00:07:55
Listing Transactions
Урок 138. 00:10:30
Firestore Queries
Урок 139. 00:06:09
Ordering Firestore Queries
Урок 140. 00:08:36
Deleting Transactions
Урок 141. 00:04:57
What Are Firestore Rules?
Урок 142. 00:05:44
The Firebase CLI
Урок 143. 00:06:16
Securing Collection Data
Урок 144. 00:03:48
Deploying Firestore Rules
Урок 145. 00:02:11
Building a React App
Урок 146. 00:03:10
Deploying to Firebase
Урок 147. 00:01:58
Updating the Site & Re-Deploying
Урок 148. 00:01:22
Rolling Back Deployments
Урок 149. 00:06:26
Project Preview & Setup
Урок 150. 00:06:42
Firebase Setup
Урок 151. 00:02:41
Firebase Init (Rules, Hosting & Storage)
Урок 152. 00:05:54
Re-using Firebase Hooks & Auth Context
Урок 153. 00:06:54
Router & Pages Setup
Урок 154. 00:07:05
Navbar Component
Урок 155. 00:11:59
Sidebar Component
Урок 156. 00:07:22
Creating a Signup Page
Урок 157. 00:13:47
Handling File Inputs
Урок 158. 00:02:41
Firebase Storage Setup
Урок 159. 00:10:48
Uploading Profile Images
Урок 160. 00:04:37
Signing a User Up
Урок 161. 00:10:36
Creating User Documents
Урок 162. 00:06:24
Logging Users Out
Урок 163. 00:04:17
Making a Login Page
Урок 164. 00:05:07
CHALLENGE - Logging Users In
Урок 165. 00:09:00
Redirects & Route Guards
Урок 166. 00:03:45
CHALLENGE - Conditional Navbar Links
Урок 167. 00:07:07
User Avatar Component
Урок 168. 00:08:46
Fetching Users
Урок 169. 00:04:15
Showing Users Online
Урок 170. 00:09:00
Making the "Create Project" Form
Урок 171. 00:05:32
Using React-Select
Урок 172. 00:11:29
Assigning Users
Урок 173. 00:07:28
Setting Form Errors
Урок 174. 00:11:23
Creating a Project Object
Урок 175. 00:06:06
CHALLENGE - Saving New Projects
Урок 176. 00:07:44
Fetching Projects
Урок 177. 00:09:39
Making a Project List / Grid
Урок 178. 00:07:28
Making a useDocument Hook
Урок 179. 00:09:08
Project Details Page (fetching a project)
Урок 180. 00:08:05
Project Summary Component
Урок 181. 00:10:13
Making a Comments Form
Урок 182. 00:07:12
Updating Firestore Documents
Урок 183. 00:04:47
Adding Comments
Урок 184. 00:06:58
Listing Comments
Урок 185. 00:09:33
Completing / Deleting Projects
Урок 186. 00:10:02
Making a Filter (part 1)
Урок 187. 00:05:00
Making a Filter (part 2)
Урок 188. 00:10:55
Making a Filter (part 3)
Урок 189. 00:11:21
Adding Firestore Rules
Урок 190. 00:03:48
Final Touches
Урок 191. 00:04:21
Deploying the App
Урок 192. 00:09:13
Intro & Starter Project
Урок 193. 00:04:34
Firebase Config File
Урок 194. 00:08:16
Getting Documents
Урок 195. 00:08:40
Real-Time Collection Data
Урок 196. 00:03:34
Adding Data
Урок 197. 00:03:20
Deleting Data
Урок 198. 00:01:09
Setting Up Firebase Auth
Урок 199. 00:06:54
Signing Users Up
Урок 200. 00:03:18
Logging Users Out
Урок 201. 00:04:08
Logging Users In
Урок 202. 00:07:31
Adding Auth Context
Урок 203. 00:06:15
Dispatching Actions
Урок 204. 00:04:55
Route Guards & Redirects
Урок 205. 00:04:32
Assigning Users to Books
Урок 206. 00:06:21
Firestore Queries
Урок 207. 00:01:30
Firebase Further Reading
Урок 208. 00:13:59
Introduction to React Router 6
Урок 209. 00:07:41
The Route Component
Урок 210. 00:07:54
Redirects & useNavigate
Урок 211. 00:10:38
Nested Routes
Урок 212. 00:09:35
Refactoring the Recipe Site
Урок 213. 00:12:37
Refactoring the Project Management Site
Урок 214. 00:00:38
Extra JavaScript Lessons
Урок 215. 00:07:01
Destructuring
Урок 216. 00:05:05
Import & Exports
Урок 217. 00:06:23
Filter & Map Methods
Урок 218. 00:02:14
Spread Syntax
Урок 219. 00:02:11
Template Strings
Урок 220. 00:02:47
Arrow Functions
Урок 221. 00:05:27
Fetch API and Promises
Урок 222. 00:03:02
Async & Await

Автор - udemy

udemy

Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.

+198

Комментарии

Mikey
30 янв. 2022 г., 17:41
Please update with new React Router Version 6 section
Yarrick Mikey
1 июн. 2022 г., 19:47
Use documentation or google. Everything almost the same.
Siddique
3 нояб. 2021 г., 04:52
Ugly Course
Amstel Siddique
15 нояб. 2021 г., 18:19
Ugly but it has 10 positive ratings against 0 negative. How come?
grayoj2 Siddique
3 нояб. 2021 г., 06:35
How?