Skip to content

Latest commit

 

History

History
62 lines (45 loc) · 3.07 KB

README.md

File metadata and controls

62 lines (45 loc) · 3.07 KB

Проект: Shop

Описание

Мини приложение для демонстрации навыков разраотки e-comerce приложений.
Приложение состоит из каталога товаров и корзины.
Корзина содержит в себе помещенные в неё товары, знает общие кол-во товаров и сумму. При изменении содержания корзины пересчитывается количество товаров и общая стоимость, а так же меняется количество товара доступное для дальнейшего заказа.
При нажатии на кнопку "оплатить" появляется модальное окно с прогресс баром, который заполняется от 0 до 100%, по достижении 100% в модальном окне появтся информация о приобретенных товарах и общей сумме.

Проект разработак как с использованием Redux Toolkit, так и с использованием Effector.
Для просмотра кода с использованием Redux Toolkit перейти в ветку redux.

git checkout redux

Архитектура проекта

Архитектура: Feature-Sliced Design

  • Shared — переиспользуемый код, не имеющий отношения к специфике приложения/бизнеса.
  • Entities (сущности) — бизнес-сущности (например, User, Product или Order).
  • Features (фичи) — взаимодействия с пользователем, действия, которые несут бизнес-ценность для пользователя.
  • Widgets (виджеты) — композиционный слой для соединения сущностей и фич в самостоятельные блоки.
  • Pages (страницы) — композиционный слой для сборки полноценных страниц из сущностей, фич и виджетов.
  • Processes — сложные сценарии, покрывающие несколько страниц (например, аутентификация).
  • App — настройки, стили и провайдеры для всего приложения.

Stacks:

  • TypeScript
  • React
  • React-Router v.6
  • Redux Toolkit
  • Effector
  • Axios
  • SCSS-module
  • Eslint
  • Node v18.x

Быстрый старт


  1. Склонировать проект на свой компьютер
git clone https://github.com/SergeyKazarinov/unicorn-test.git
  1. Установить зависимости
npm install
  1. Запустить проект (запуск сервера + frontend проекта в dev режиме)
npm run start:dev