Запуск проекта

npm install - устанавливаем зависимости
npm run start - запуск frontend проекта 

---

Скрипты

• npm run start - Запуск frontend проекта на webpack dev server
• npm run build:prod - Сборка в prod режиме
• npm run build:dev - Сборка в dev режиме
• npm run lint:ts - Проверка ts файлов линтером
• npm run lint:ts:fix - Исправление ts файлов линтером
• npm run lint:scss - Проверка scss файлов style линтером
• npm run lint:scss:fix - Исправление scss файлов style линтером

---

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

Проект написан пользуясь с методологией Feature-Sliced Design

Ссылка на документацию - feature sliced design

---

Конфигурация проекта

Для разработки проект использовался Webpack

Конфигурация хранится в /config

• /config/build - конфигурация webpack

---

Работа с переводами

В проекте используется библиотека i18next для работы с переводами. Файлы с переводами хранятся в public/locales.

Документация i18next - https://react.i18next.com/

---

Работа с данными

Взаимодействие с данными осуществляется с помощью redux toolkit. Также для нормализация данных используется EntityAdapter

Запросы на сервер отправляются с помощью async thunk и RTK query

Для асинхронного подключения редюсеров (чтобы не тянуть их в общий бандл) используется DynamicModuleLoader

---

Отображение списков

Используется библиотека React Virtuoso

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

Документация React Virtuoso - https://virtuoso.dev/

---

app

Настройки, стили и провайдеры для всего приложения.

---

Сущности (entities)

• Article
• Cart
• Profile
• Favorite
• Product
• Rating
• User

shared

Находится переиспользуемый код:

• api - для настройки axios
• config - для настройки i18next
• const
• hooks - пользовательский хуки
• components : DynamicModuleLoader (компонент для асинхронного подключения reducer ), AnimationProvider (асинхронная подрузка библиотек)
• ui - переиспользуемые компоненты во всем проекте