Видео

Ссылка на видео на YouTube: https://youtu.be/3uIkfu_7Sv0

Описание

Проект состоит из двух частей — сайт, написанный с помощью React и Redux (Redux Toolkit), а также серверная часть, созданная с помощью Express JS. Используется база данных Mongo DB.

Если пользователь не авторизован, на сайте он может просто смотреть еду, а также добавлять её в корзину. Пользователь может посмотреть такую информацию о еде: название, описание, вес, цена, а также её картинки. Можно фильтровать еду по категории (пицца, бургеры и т. д.), а также искать еду по названию или описанию (при этом не обязательно вводить полностью, можно ввести часть названия/описания). Есть система авторизации. Только зарегистрированный пользователь может сделать заказ. Есть личный кабинет, где пользователь может изменить данные о себе, а также отследить все свои заказы, а также увидеть статус доставки каждого заказа.

Серверная часть (backend) — это Restful API. Сайт отправляет запросы на API, чтобы добавить какие-то записи в базу данных, обновить их, удалить и т. д. API позволяет выполнять CRUD операции (создание, чтение, обновление и удаление) над такими сущностями, как: еда, категории еды, пользователи, заказы. Кроме того, API позволяет получить статистику по пользователям (сколько пользователей зарегистрировалась за определенный месяц, за определенный год, за день), получить заказы определённого пользователя и т. д. Также реализована оплата с помощью платёжной системы Stripe. Есть несколько ролей: администратор, зарегистрированный пользователь и незарегистрированный пользователь. Есть разграничение прав в зависимости от роли. Например, администратор может выполнять все операции, незарегистрированный пользователь не может сделать заказ, зарегистрированный пользователь может получить доступ только к своим личным данным (эл. почта, имя и т. д.), но не сможет получить доступ к данным других пользователей и т. д.

Как запустить?

Шаг 1 – Создать базу данных в MongoDB Atlas.

Инструкцию как создать базу данных в Mongo DB Atlas можно найти по этой ссылке

Создать файл .env в директории server, указать URL для соединения с базой данных в этом файле. Обратите внимание, что вместо <password> нужно указать ваш пароль. В директории server есть файл .env.test – это шаблон, как нужно заполнять файл .env.

Шаг 2 – Зарегистрироваться в системе Stripe

Создать файл .env в директории client, заполнить этот файл по шаблону из файла .env.test, который находится в директории client.

Перейти по ссылке и найти там API keys. Добавить в файлы .env в директориях client и server API keys как показано на рисунке.

Шаг 3 – Установить необходимые npm пакеты.

Если у вас не установлен Node JS, его надо установить. Сделать это можно на официальном сайте Node JS.

Перейдите в директорию server, откройте терминал в ней. Выполните такие команды в терминале:

npm install
npm run start

Перейдите в директорию client, откройте терминал в ней. Выполните такие команды в терминале:

npm install 
npm run dev

Перейдите по этой ссылке в браузере:

http://localhost:5173/