Skip to content

lsemeniuk/fe-20_final_project

Repository files navigation

Build Status

Для начала работы нужно настроить окружение

Установка Prettier (для vs code, кто на webstorm всё аналогично)

Установите расширение Prettier - Code formatter.

Установите default formater. Чтобы открыть палитру команд, вы можете использовать COMMAND + SHIFT + P в macOS или CTRL + SHIFT + P в Windows.
Выполните в палитре команд поиск по ключевому слову format и выберите Format Document.
Возможно, вам будет предложено выбрать формат для использования. Для этого нажмите кнопку Configure. Затем выберите Prettier - Code Formatter.
Если вы не видите диалога выбора формата по умолчанию, вы можете вручную изменить его в разделе «Настройки». Установите для Editor: Default Formatter значение ebsenp.prettier-vscode.

Установите форматирование кода при сохранении.
Чтобы изменить эту настройку, нажмите COMMAND + в macOS или CTRL + в Windows, чтобы открыть меню Settings (Настройки). Выполните в меню поиск Editor: Format On Save и убедитесь, что эта опция включена. Теперь вы можете писать код как обычно, и он будет автоматически форматироваться при сохранении файла.

Файл .prettirrc

{
"printWidth": 120, длина строки - 120
"tabWidth": 2, длина "таба" - 2 пробела
"useTabs": false, использовать пробелов вместо табов
"semi": true, точка с запятой - нет
"singleQuote": true, использовать одинарные кавычки - да!
"trailingComma": "es5", запятая в последней строке - да
"bracketSpacing": true, пробел между скобками
"jsxBracketSameLine": false, закрывающийся jsx в этой же строке
}

Установка Eslint (для vs code, кто на webstorm всё аналогично)

Установите расширение ESLint. В Корне проекта лежит файл конфигураций eslintrc, в package.json в devDependencies прописаны все плагины для работы с Eslint в паре с prettier, видео-1 видео-2 .

Непосредственно выполнение задач

Работа с git

Разделение на ветки

Для выполнения задачи (блока) от ветки dev ($ git checkout dev) создаём новую ветку с названием описывающим блок либо задачу ($ git branch name) документация git

Pull request

Прямые коммиты в ветку master ЗАПРЕЩЕНЫ!
Слияние выполняем с веткой dev. Pull request - это запрос на слияние вашей ветки в ветку dev. Для слияния в основную ветку dev нужно два Approve от учасников команды. Поэтому после создания Pull request обязательно пишите в ощий чат. Как выполнять Pull request

Прошу качественно просматривать Pull request для улучшения качества кода. Все мы учимся, даже професионалы допускают ошибки. видеоматериал

Работа со стилями

Для стилизации проекта используем styles module а именно SCSS модули.

SCSS модуль это на самом деле .scss файл, который скомпилирован. Будучи скомпилированным он выдает две выдачи. Первая это SCSS, который являет собой модифицированную версию написанного SCSS с переименованными классами. А другая, это JavaScript объект, который формирует исходный SCSS с уже переименованными классами, документация.

Добавлены глобальные стили + \_var.scss (для переменных). Для использования переменных в scss необходимо их импортировать непосредственно в файл модуля стилей (примерный путь: @import '../../utils/styles/var';)

Для компонентов которые должны оборачиваться контейнером создан компонент Container.

About

DAN.IT groups fe-20 final project

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages