Home
Для того, чтобы залить свои изменения в проект, необходимо пройти несколько этапов:
- Создать новую ветку. Для каждой задачи - отдельная ветка, создается от последней версии ветки develop (перед созданием новой ветки обязательно стянуть последние изменения - git pull). Желательно назвать ветку так, чтобы отражалась суть вносимых изменений
Шаблоны для веток: для новых фичей - feature/<здесь краткое описание содержимого>; для исправлений - fix/<здесь краткое описание исправлений>; для правки багов - bug/<здесь краткое описание или идентификатор исправленного бага>; для объемного рефакторинга - refactor/<здесь краткое содержание изменений>. Например, feature/authorization, feature/new-design, bug/form-validation.
- Выполнить изменения (не забываем соблюдать договоренности) и создать коммит. Наименования коммитов также желательно делать понятными.
Шаблон для коммитов: <разновидность изменений>: <краткое описание изменений>. Например, 'fix: rewrite error messages', 'feat: add validation to main form'.
- Запушить свою ветку и создать пул-реквест. Пулреквест создается к ветке develop. Следует дождаться ревью: для того, чтобы стал доступен merge и ветка была залита, необходимо как минимум два апрува от других участников репозитория. В параметрe Reviewers можно запросить ревью и одобрение у конкретных пользователей.
Пул-реквесты оформлять в соответствии с инструкцией.
Инструкция оформления PR:
-
Если возник конфликт с основной веткой - решить конфликт. Оптимально работать с конфликтами локально, для этого: стянуть последнюю версию develop; перейти в свою ветку; замерджить изменения из ветки develop; решить конфликты в каждом проблемном файле в merge editor; сохранить данные изменения и запушить в удаленную версию своей ветки.
-
После влития удалить данную ветку. Это требуется, чтобы не засорять репозиторий.
Весь исходный код проекта находится в папке src корневой директории.
-
Папка assets содержит статические изображения. В ней папка icons - исключительно иконки.
-
Папка components содержит все React-компоненты и имеет папки двух видов. Папка компонента принимает название React-компонента и содержит три файла общего вида - Component.tsx (разметка), Component.module.scss (стили) и index.ts (экспорт компонента). Второй вид папок - группирующие React-компоненты по типу: pages (страницы приложения), UI (основные повторяющиеся UI-компоненты).
-
Папка styles содержит папку fonts (исходные файлы шрифтов + подключение в fonts.scss), файлы global.scss (стили, которые применяются ко всему проекту), colors.scss (css-переменные цветов), mixins.scss (миксины), index.scss (подключение цветов и миксинов), normalize.scss.
-
Папка static содержит файлы со статическими текстами со всего проекта.
-
Папка shared содержит повторяющиеся и переиспользуемые во всем проекте инструменты. В ней папка interfaces для интерфейсов, папка types для типов, папка contexts для хранения контекстов, папка hooks для кастомных хуков.
-
Папка api содержит файлы, отвечающие за логику подключения API.
-
Папка store появится при подключении в проект стейт-менеджера.
-
Папка utils с дополнительными данными проекта. В ней файл constants.ts - для постоянных значений, которые могут повторяться во всем приложении (например, названия роутов) и могут быть другие файлы для хранения, к примеру моковых данных.
-
Файл index.ts
-
Файл Component.tsx содержит разметку функциональных компонентов. Допускается хранение типов, интерфейсов, переменных и функций, которые будут использованы исключительно в данном компоненте. Для удобства импорты желательно структурировать - в первую очередь добавляются импорты из библиотек, далее собственные компоненты и инструменты, далее собственные константы и стили. Собственные стили компонента подключаются модульно, импорт общего вида выглядит следующим образом: import styles from './Component.module.scss'.
-
Файл Component.scss представляет собой модуль со стилями компонента. Общие правила для наименований внутри модуля - camelCase без лишних символов в начале или конце, возможно добавление модификаторов следующего вида: element_modificator.
-
Файл index.ts нужен для экспорта данного компонента.