🔥 Оформить премиум подписку - https://htmllessons.ru/premium?utm_source=youtube&utm_medium=red-group&utm_campaign=description&utm_content=amazon-2-0
► Как купить из других стран - https://t.me/redgroupchannel/37
Новый большой проект на канале, сегодня мы научимся разрабатывать свой интернет магазин с нуля. На фронте будем использовать Next js React и Nest js на бэкенд. В качестве базы данных для нашего Amazon 2.0 будем использовать PostgreSQL и ORM Prisma. На frontend, в качестве state management используем Redux Toolkit. Для написания стилей будем использовать Tailwind CSS. Формы будем создавать и обрабатывать с помощью react hook form. Типизация в нашем проекте будет на TypeScript (TS). [ AMAZON 2.0 - ИНТЕРНЕТ МАГАЗИН с нуля за 6 часов ]
💸 Добыл для Вас бонус от Юкасса бесплатный тариф премиум - https://yookassa.ru/joinups/?source=htmllessons
Надеюсь Вы оцените мои старания, с Вас лайк и подписка. 🔥 2000 лайков и я снимаю вторую часть.
Если есть какие то вопросы по этой теме - дай знать в 💬 комментариях!
Скачать 🖥 готовый проект в нашем хранилище (требуется подписка) - https://htmllessons.ru/repositories#storage_file_73
🦋 Дизайн + Todo - https://t.me/redgroupchannel
⚡️ Список интенсивов по подписке - https://htmllessons.ru/list-intensives?utm_source=youtube&utm_medium=red-group&utm_campaign=description&utm_content=amazon-2-0
🍥 Тема в редактор/IDE - Cobalt3 dark
00:00:00 - Начало
00:00:28 - Какой стэк?
00:02:28 - Про исходники
00:03:15 - Новый формат для подобных проектов
00:08:15 - ДЕМО
00:14:13 - Создание back-end
00:24:05 - Настройка VS Code
00:29:00 - Создание базы данных
00:37:02 - Делаем регистрацию
00:44:42 - Делаем авторизацию
01:08:54 - To-do list
01:12:21 - Декоратор
01:15:43 - Генерируем user
01:16:20 - Какие модели должны присутствовать?
01:16:51 - Модель продукты (Product)
01:17:58 - Модель категории (Category)
01:18:09 - Модель отзывы (Review)
01:18:20 - Модель заказ (Order)
01:19:00 - Модель OrderItem
01:19:26 - Делаем связи
01:23:00 - Сделали полноценную схему
01:23:27 - Создаём юзера
01:26:08 - Делаем patch
01:27:23 - Создаём service
01:33:45 - Проверяем
01:34:50 - Делаем seedeer
01:43:24 - Проверяем добавленные данные
01:44:23 - Закончили с генирацией данных
01:45:33 - Товары, создаём структуру
01:49:22 - Сервис для категорий
01:54:00 - Контроллер для категорий
01:57:46 - Проверка работы контроллера
01:59:45 - Исправление ошибок
02:03:10 - Сервис для отзывов
02:06:45 - Контроллер для отзывов
02:08:46 - Сервис для статистики
02:17:59 - Сервис для пагинации
02:19:26 - Сервис для заказов
02:20:15 - Переходим к товарам нашего магазина
02:22:08 - Сервис для продуктов
02:33:10 - Контроллер для продуктов
02:34:32 - Тестируем
02:36:43 - Переходим к frontend
02:37:07 - Что будем использовать для frontend
02:38:29 - Создаём Next приложение
02:44:22 - Ставим Tailwind css
02:45:15 - Начинаем писать стили
02:55:54 - Создаём сервисы
02:57:05 - api helper
02:57:36 - api interceptor
02:59:20 - Создаём работу с токенами
03:02:30 - Продолжаем работу с interceptor.ts
03:06:07 - Auth service
03:12:24 - Category service
03:17:33 - Review service
03:19:43 - User service
03:23:00 - Order service
03:24:48 - Statistics service
03:25:57 - Payment service
03:26:34 - Product service
03:32:12 - Что нужно сделать дальше?
03:37:12 - О React Query
03:38:00 - О Redux Toolkit
03:39:27 - User actions
03:41:24 - User slice
03:43:07 - Создаём hooks
03:43:16 - useActions
03:45:09 - useTypedSelector
03:45:41 - useAuth
03:47:36 - AuthProvider
03:47:55 - CheckRole - для проверки роли
03:52:29 - Поговорим о SSR & SSG & ISR
03:59:33 - Делаем страницу логина
04:36:40 - Делаем главную страницу
04:43:49 - Делаем каталог
05:09:26 - Исправляем ошибки
05:23:19 - Делаем визуал
05:28:55 - Решена проблема с авторизацией
05:30:43 - Продолжаем работать над визуалом
05:44:35 - Делаем сортировку и подгрузку
06:03:20 - Что было за кадром?
06:13:25 - Реализуем оплату
06:37:25 - Финал
06:47:25 - В заключении
#Amazon #React #nextjs #nestjs #typescript #redux #RedGroup
👉 Все ссылки (+ настройка редактора) и информация обо мне - https://htmllessons.io/links
Смотрите видео ДО КОНЦА, подписывайтесь на канал, ставьте 👍 и колокольчик 🔔