Необходимо сверстать приложение согласно макету Figma используя React

1 500 руб. за проект
26 апреля 2024, 22:22 • 25 откликов • 179 просмотров
Приветствую! Нужна помощь с задачей ниже. Условия и сроки обсуждаемы.
Условие:
Задана ссылка на макет фигмы (Интернет-магазин):

https://www.figma.com/file/0pMguGfGcTgufmXlNJe5gO/IE-FE?type=design&node-id=0%3A1&mode=design&t=SVYvDXP7EzFIVWrg-1

Необходимо сверстать приложение согласно макету используя React.

В проекте должны использоваться библиотеки для реализации механизмов работы магазина:

  • React-router-dom
  • React-hook-form
  • Redux
  • Redux-thunk
Основные технические требования:

  1. Архитектура приложения (паттерн проектирования) должен соответствовать подходу - (у каждого компонента своя папка (UI компоненты, pages компоненты, хранилище)). У каждого компонента должна быть модульная стилизация (и так же общая стилизация для всех компонентов). Имена компонентов должны полностью соответствовать их содержимому.
  2. В работе должно быть реализовано redux-хранилище с редьюсерами:
  3. Продукты, категории, продукт, корзина. Данные должны подтягивать асинхронно используя сетевые запросы, адресованные *бекенду.
  4. Для каждой страницы должен быть реализован _Page-компонент, формирующую специальную ссылку (path) для доступа (определяется самостоятельно).


Бэкенд:(архив направлю исполнителю)

Сетевые запросы должны быть адресованы локальному бэкенду.

Необходимо его скачать и выполнить установку node_modules, используя команду:

npm i

После установки для запуска выполните команду:

npm run dev

Далее инструкции находятся в файле README.MD


Критерии оценки:

  1. Стилизация итогового проекта полностью удовлетворяет требования, указанных в макете. (макс. 20 баллов)
  2. В проекте соблюдается паттерн проектирования. Имена компонентов соответствуют их содержимому, присутствует модульная стилизация, верным образом сформирована архитектура хранилища. (макс. баллов 30)
  3. В работе используется хранилище Redux. Осуществляются сетевые запросы к бекенду. Хранилище верным образом работает с стейтом (фильтрация товаров, сортировка, заполнение) (макс. баллов 50)
Файлы