Интернет-магазин с CMS

Создание полнофункционального интернет-магазина с CMS на Next.js, NestJS и Prisma с авторизацией через Google и Yandex и панелью управления.

О курсе

В этом видео мы создадим полнофункциональный интернет-магазин с CMS, используя современный стек Next.js, NestJS и Prisma. Также будет реализована авторизация через Google и Yandex, что обеспечит пользователям удобный и безопасный способ входа в систему. Результатом станет высокопроизводительное и масштабируемое e-commerce решение с удобной панелью управления контентом.

• 1

  Интро

  Мы начинаем наше путешествие в создание интернет-магазина. В этой главе мы рассмотрим основные технологии, необходимые для разработки и обсудим стэк технологий

• 2

  База данных

  В этой главе мы настроим Nest.js для разработки интернет-магазина. Мы также изучим, как создавать схемы с помощью Prisma, удобного ORM для работы с базами данных.

• 3

  Авторизация

  В этой главе мы рассмотрим, как настроить авторизацию через аккаунты Google и Яндекс в нашем приложении на Nest.js. Мы также изучим использование JWT токенов для безопасной аутентификации пользователей.

• 4

  Сущность для магазинов

  В этой главе мы разработаем сущность для управления магазинами с помощью Nest.js и Prisma, настроив структуру данных для хранения информации о магазинах.

• 5

  Сущность для цветов

  В этой главе мы создадим сущность для управления цветами и категориями товаров в нашем приложении. Будет настроена база данных для хранения различных цветов, их свойств, а также категорий и их атрибутов, что позволит удобно управлять вариациями цветов и систематизировать ассортимент продуктов для эффективного управления.

• 6

  Сущность для файлов

  В этой главе мы создадим сущность для загрузки файлов в нашем приложении.

• 7

  Сущность для товаров

  В этой главе мы разработаем сущность для управления товарами в интернет-магазине. Будет настроена база данных для хранения информации о продуктах, их характеристиках и связях с другими сущностями, обеспечивая гибкость и эффективность управления ассортиментом товаров.

• 8

  Сущность для отзывов

  В этой главе мы создадим сущность для управления отзывами пользователей. Будет настроена база данных для хранения отзывов о продуктах или услугах, что позволит эффективно управлять обратной связью от пользователей и их оценками продуктов.

• 9

  Сущность для заказов

  В этой главе мы реализуем сущность для управления заказами . Будет настроена база данных для хранения информации о заказах, их статусах и связанных данных, что обеспечит эффективное управление процессом заказов в приложении. Оформление заказов будет реализовано с использованием платёжной системы YooKassa.

• 10

  Сущность для статистики

  В этой главе мы реализуем сущность для сбора статистики в нашем интернет-магазине. Мы настроим систему для автоматического сбора данных о просмотрах и покупках товаров.

• 11

  Настройка фронтэнда

  В этой главе мы настраиваем фронтэнд нашего интернет-магазина с помощью Next.js. Устанавливаем необходимые инструменты и настраиваем окружение для разработки.

• 12

  Все типы

  В этой главе мы опишем все типы данных, используемые для взаимодействия с сервером. Рассмотрим, как они помогают организовать структуру данных и обеспечить корректную работу приложения.

• 13

  Axios интерсепторы

  В этой главе мы рассмотрим, как использовать Axios интерсепторы для управления запросами. Интерсепторы позволяют нам добавлять функциональность к запросам, изменять их поведение и обрабатывать ответы.

• 14

  Форма входа

  В этой главе мы создадим страницу авторизации. Будет реализована простая и удобная форма входа, а также добавлена возможность авторизации через Google и Яндекс.

• 15

  Layout для магазина

  В этой главе мы создаем layput для страницы панели управления магазина в нашем интернет-магазине. Мы реализуем удобную навигацию для управления магазином и его контентом, а также добавим возможность переключения между разными магазинами пользователя.

• 16

  Статистика магазина

  В этой главе мы создадим страницу статистики вашего интернет-магазина. На ней будут отображаться продажи за месяц и список последних покупателей. Это поможет вам анализировать производительность магазина и принимать решения для его развития.

• 17

  Настройки магазина

  В этой главе мы создадим страницу с настройками магазина. Разработаем удобный интерфейс, позволяющий пользователям легко настраивать параметры своего магазина.

• 18

  Таблица с товарами

  В этой главе мы создадим таблицу для отображения товаров с помощью компонента Shadcn. Пользователи смогут видеть основные характеристики товаров и использовать функции сортировки и фильтрации для удобного управления.

• 19

  Создание и изменение

  В этой главе мы разработаем страницу для добавления и редактирования товаров. Интерфейс будет простым и интуитивно понятным, с полями для ввода всех необходимых данных и валидацией для обеспечения корректности информации.

• 20

  Страницы в магазине

  В этой главе мы расширим возможности панели управления магазином, предоставив пользователям инструменты для управления ключевыми аспектами, такими как отзывы, категории и цвета. Это позволит им эффективно поддерживать актуальность и структуру каталога товаров, а также контролировать отзывы покупателей.

• 21

  Main Layout

  В этой главе мы создадим основной layout для сайта нашего интернет-магазина. Основной layout будет использоваться на всех страницах сайта, кроме страниц управления магазинами.

• 22

  Главная страница

  В этой главе мы создадим главную страницу интернет-магазина. Мы добавим секцию Hero с лозунгом и описанием магазина, а также компонент каталога с товарами.

• 23

  Каталоги

  В этой главе мы создадим страницу с категориями, каталогом товаров и поиском с помощью компонента Catalog, позволяя пользователям легко находить интересующие товары и просматривать избранное. Также в личном кабинете будет отображаться история всех заказов, совершенных пользователем.

• 24

  Страница с товаром

  В этой главе мы создадим страницу с товаром, которая будет отображать ключевую информацию, включая название, цену, описание, категорию, цвет и средний рейтинг, рассчитываемый по отзывам. Пользователи смогут оставлять отзывы на этой же странице. Также будут представлены похожие товары и галерея с изображениями, что поможет покупателям лучше оценить продукт.

• 25

  Корзина + оплата

  В заключительной главе мы разработаем корзину с помощью Redux, где пользователи смогут добавлять, удалять и изменять количество товаров, а также видеть итоговую стоимость заказа.