Этот шаблонный проект предназначен для быстрого старта разработки приложений на React с использованием управления состоянием Redux и TypeScript. Он также предварительно настроен с использованием различных инструментов для обеспечения качества кода и удобства разработки, таких как линтеры, хуки коммитов и т.д.
React и Redux: React используется для создания пользовательских интерфейсов, а Redux - для эффективного управления состоянием приложения. Это позволяет организовать код в приложении таким образом, чтобы он был более предсказуемым и легко масштабируемым.
TypeScript: Использование TypeScript обеспечивает статическую типизацию, что помогает предотвратить множество ошибок на этапе разработки и повысить общее качество кода.
Инструменты линтинга: Проект настроен с использованием ESLint для линтинга JavaScript и TypeScript кода, а также Stylelint для линтинга CSS и SCSS файлов. Эти инструменты помогают поддерживать единообразие кода, выявлять потенциальные проблемы и улучшать читаемость кода.
Автоматическое форматирование кода: Prettier включен для автоматического форматирования кода, что позволяет избежать дискуссий о стиле кода в команде разработчиков и обеспечивает единообразие в стиле кодирования.
Хуки коммитов: Используя Commitlint и Husky, проект настроен на проверку сообщений коммитов перед их фиксацией. Это гарантирует соблюдение определенных соглашений о формате коммитов и улучшает читаемость истории коммитов.
Клонируйте репозиторий:
git clone https://github.com/NotACat1/React-TypeScript.gitУстановите зависимости:
npm installЗапустите сервер разработки:
npm run startТеперь вы готовы начать разработку вашего приложения React на основе этого шаблона.
После установки проекта вы можете использовать следующие скрипты:
"start": "react-scripts start"
Этот скрипт запускает приложение в режиме разработки. Он использует react-scripts, который обеспечивает сборку проекта и запуск локального сервера для разработки.
"build": "react-scripts build"
Этот скрипт создает оптимизированную сборку приложения для производства. Он также использует react-scripts для сборки проекта, но результаты сохраняются в каталоге build.
"test": "react-scripts test"
Этот скрипт запускает тестовый раннер для вашего приложения. Он также использует react-scripts для запуска тестов в интерактивном режиме просмотра.
"eject": "react-scripts eject"
Этот скрипт используется для "извлечения" конфигурации react-scripts. Когда вы выполняете этот скрипт, все настройки и зависимости react-scripts будут скопированы в ваш проект, и вы сможете их настраивать по своему усмотрению.
"predeploy": "npm run build"
Этот скрипт запускается перед развертыванием (deploy). В данном случае он просто запускает скрипт build, чтобы убедиться, что перед развертыванием приложение собрано.
"deploy": "gh-pages -d build"
Этот скрипт используется для развертывания вашего приложения на GitHub Pages. Он использует инструмент gh-pages, чтобы опубликовать содержимое каталога build вашего проекта на GitHub Pages.
"husky-inst": "npx husky install && chmod +x .husky/pre-commit .husky/commit-msg"
Этот скрипт используется для установки Husky и настройки его хуков. Он использует npx husky install, чтобы установить Husky, и chmod +x для установки прав на выполнение скриптов pre-commit и commit-msg.
"msg-commit": "npx commitlint -E HUSKY_GIT_PARAMS"
Этот скрипт используется для проверки сообщений коммитов перед фиксацией. Он использует инструмент commitlint, чтобы проверить формат сообщения коммита.
"lint": "npx lint-staged"
Этот скрипт используется для линтинга измененных файлов перед коммитом. Он использует инструмент lint-staged, чтобы линтить только те файлы, которые были изменены, ускоряя процесс линтинга.
Мы приветствуем ваши вклады в этот проект. Вы можете помочь нам, отправляя отчеты о найденных ошибках, предложения по улучшению функциональности или запросы на внесение изменений.