Приложение для доставки еды React Native

🌟 Поддержать автора:
🔗 Проект на сайте:
📢 Присоединяйтесь к Telegram каналу:
В этом крутом видео я покажу как создать крутое мобильное приложение. В целом мы реализуем полноценное приложение для доставки еды на React Native, с использованием огромного количества технологий. Также структура проекта будет максимально масштабируемой. 🎯 Что реализуем в видео: 🛠️ Full-stack реализация 💳 Реализация оплаты 🛒 Полноценная корзина и оформление заказа 🔑 Авторизация пользователей 🛠️ Стэк проекта: React Native, Nest.js, PostgreSQL, Prisma, React Hook Form, Redux Toolkit, TypeScript 🕒 Таймкоды: 00:00:00 - Начало 00:00:32 - Стэк проекта 00:01:35 - ДЕМО 00:04:26 - Разворачиваем бэкэнд 00:06:58 - Настройка VS Code 00:08:41 - Создание БД 00:14:18 - Первая генерация 00:16:29 - Как будет работать авторизация 00:18:00 - Авторизация 00:36:40 - Декораторы 00:39:00 - Заканчиваем описывать схему БД 00:43:11 - Генерируем все сущности 00:44:00 - Сервис для категорий 00:50:27 - Контроллер для категорий 00:53:27 - Проверка работы контроллера 00:55:18 - Сервис для продуктов 01:02:42 - Контроллер для продуктов 01:03:36 - Тестируем 01:06:18 - Описываем юзера 01:08:18 - Проверяем контроллер для юзера 01:10:15 - Что такое React Native? 01:11:02 - Разворачиваем фронтенд 01:11:57 - Структура проекта 01:13:20 - Как запустить проект? 01:16:53 - Настройка prettier, babel, tsconfig 01:21:26 - Навигация в приложении 01:30:47 - Tailwind в React Native 01:32:26 - Страница входа React hook form 01:40:25 - Компонент Button 01:45:27 - Компонент Field и Generic 01:50:40 - Компонент AuthFields 01:54:43 - AuthContext и Splash Screen 02:00:56 - useAuth 02:01:23 - Доделываем навигацию 02:03:10 - Нижнее меню и слушатель роутов 02:14:55 - Компонент Toast 02:16:48 - api request 02:20:17 - api interceptors 02:23:43 - Создаём работу с токенами 02:29:35 - Продолжаем работать с интерсепторами 02:35:03 - Auth service 02:37:23 - Хук useCheckAuth 02:37:23 - useCheckAuth 02:40:12 - Доделываем AuthProvider 02:41:25 - Подключаем Tanstack Query 02:42:51 - Пишем первые мутации 02:47:11 - User Service 02:48:27 - Хук useProfile 02:49:26 - Layout приложения 02:50:28 - Компонент Heading 02:51:10 - Страница профиля 02:54:08 - Переходим к главной странице 02:56:44 - Category Service 02:58:40 - Хук useGetAllCategories 02:59:30 - Категории на главной 03:03:44 - Делаем каталог 03:15:57 - Страница поиска 03:21:31 - Страница Explorer 03:23:13 - Хук useTypedRoute 03:24:10 - Хук useCategory 03:26:58 - Отдельная страница с категорией 03:28:40 - Хук useProduct 03:29:24 - Отдельная страница с продуктом 03:36:22 - Список избранного 03:36:55 - Добавление в избранное 03:39:20 - store.ts 03:41:00 - Redux корзина 03:43:47 - Хук useTypedSelector 03:44:16 - Хук useActions 03:44:45 - Хук useCart 03:45:31 - Добавление товаров в корзину 03:49:00 - Страница корзины 03:54:37 - Заканчиваем описание схемы БД 03:57:40 - Подключаем Stripe 03:59:02 - Order Service 04:01:01 - Order Dto 04:01:57 - Заканчиваем Order Service 04:03:11 - Order Controller 04:03:57 - Тестируем оплату 04:05:44 - Оплата на клиенте 04:11:45 - Финал #react #reactnative #typescript #teacoder

Смотрите также