Перейти к основному содержанию
Header

Полезные команды

Запуск приложения

npx nx start twenty-front

Перегенерировать схему graphql на основе схемы API graphql

npx nx run twenty-front:graphql:generate --configuration=metadata
ИЛИ
npx nx run twenty-front:graphql:generate

Lint

npx nx run twenty-front:lint # pass --fix to fix lint errors

Переводы

npx nx run twenty-front:lingui:extract
npx nx run twenty-front:lingui:compile

Тест

npx nx run twenty-front:test # run jest tests
npx nx run twenty-front:storybook:serve:dev # run storybook
npx nx run twenty-front:storybook:test # run tests # (needs yarn storybook:serve:dev to be running)
npx nx run twenty-front:storybook:coverage # (needs yarn storybook:serve:dev to be running)

Технологический стек

The project has a clean and simple stack, with minimal boilerplate code. Приложение Тестирование Инструменты

Архитектура

Маршрутизация

React Router обрабатывает маршрутизацию. Чтобы избежать ненужных перерисовок, вся логика маршрутизации находится в useEffect в PageChangeEffect.

Управление состоянием

Recoil обрабатывает управление состоянием. См. лучшие практики для получения дополнительной информации об управлении состоянием.

Тестирование

Jest служит инструментом для модульного тестирования, а Storybook — для тестирования компонентов. Jest в основном используется для тестирования утилит, а не самих компонентов. Storybook предназначен для тестирования поведения изолированных компонентов, а также для отображения системы дизайна.