udemy
Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
React Pizza Shop - Заказываейту еду с Hooks и Firebase
React Pizza Shop - Ordering Food with Hooks and Firebase
★4.7 (всего оценок - 19)
Продолжительность
4 ч 43 мин
Категория
React.jsКоличество уроков
34 Видео
Дата добавления
7 дек. 2019 г., 13:40
Язык
Английский
Дата выхода
14 нояб. 2019 г., 00:00
Дата обновления
29 апр. 2026 г., 05:54
React Pizza Shop — это практический курс, который поможет вам научиться создавать полноценное веб‑приложение для заказа еды, используя React Hooks, Firebase и Styled‑Components. Вы шаг за шагом соберёте современный интерфейс ресторана, интерактивные диалоговые окна и систему оформления заказа — от выбора пиццы до получения e‑mail подтверждения.
Что вы создадите в рамках курса
В этом проекте вы разработаете функциональный сервис доставки: пользователи смогут выбирать блюда, настраивать ингредиенты, входить через Google‑аккаунт и отправлять заказ, который сохраняется в Firebase Realtime Database. Интерактивность и гибкость достигаются благодаря кастомным React Hooks и адаптивному UI.
Основные элементы приложения
- Меню с динамическими товарами
- Редактируемые всплывающие диалоговые окна
- Корзина и панель заказа
- Отправка заказов и e‑mail подтверждения
Чему вы научитесь
Курс объединяет технологические навыки, подходящие для разработчиков среднего уровня, которые хотят прокачать знания React и познакомиться с Firebase на реальном проекте.
Работа с React Hooks
- useState и useEffect на практике
- Создание пользовательских хуков:
- для управления формами и вводом данных
- для аутентификации
- для всплывающих диалогов
- для управления заказами
Современная разработка интерфейсов
- Styled‑components для модульного и чистого CSS
- Всплывающие модальные окна
- Создание кнопок, инпутов, чекбоксов
- Использование стоковых фото
- Flexbox и CSS Grid
- CSS‑анимации и Google Fonts
Использование Firebase
- Развертывание приложения
- Google‑аутентификация: вход и выход
- Работа с Realtime Database для отслеживания заказов
- Серверные функции для обработки отправленных заказов
Функционал оформления заказов
- Добавление, редактирование и удаление позиций
- Расчет цены, налогов и итоговой суммы
- Динамическая генерация товаров
- Отправка заказа по электронной почте через Node.js и Nodemailer
Кому подойдет этот курс
Материал идеально подойдет разработчикам, знакомым с основами React, которые хотят улучшить свои навыки, изучить Firebase и собрать интересный продукт от начала до конца. Полный исходный код включен, поэтому вы сможете легко разбирать детали и дорабатывать приложение под себя.
Почему этот проект стоит пройти
По итогу вы получите не просто теоретические знания, а настоящий рабочий сервис доставки еды — отличный пример для портфолио и демонстрации навыков клиент‑сайд разработки, работы с бэкендом и интеграциями.
- Урок 1.00:04:16create-react-app
- Урок 2.00:01:42Welcome to Sliceline
- Урок 3.00:01:22Remove boilerplate
- Урок 4.00:03:31createGlobalStyle
- Урок 5.00:03:14Google Fonts
- Урок 6.00:12:30Navbar
- Урок 7.00:06:52Banner
- Урок 8.00:01:48CSS Filters
- Урок 9.00:19:48FoodGrid
- Урок 10.00:05:12Food Sections
- Урок 11.00:04:24CSS Transitions
- Урок 12.00:01:52Cleanup App
- Урок 13.00:02:20useState example
- Урок 14.00:13:33Food Dialog
- Урок 15.00:04:58Order
- Урок 16.00:04:41Flexbox Direction Column
- Урок 17.00:09:30DialogButton and Order Layout
- Урок 18.00:02:45Review
- Урок 19.00:08:32Orders Hooks
- Урок 20.00:02:46List Orders
- Урок 21.00:07:44Price
- Урок 22.00:06:57Favicon and useTitle
- Урок 23.00:29:39Quantity
- Урок 24.00:04:42Total
- Урок 25.00:16:43Toppings
- Урок 26.00:16:09Choices
- Урок 27.00:11:49Edit & Delete Orders
- Урок 28.00:05:31Firebase Install
- Урок 29.00:10:05Firebase Auth
- Урок 30.00:12:49Firebase Auth part 2
- Урок 31.00:11:59Firebase Realtime Database
- Урок 32.00:12:12Order Confirmation Dialog
- Урок 33.00:01:12Firebase Gmail Setup
- Урок 34.00:20:40Firebase Functions / Nodemailer email
Автор - udemy
Комментарии