Frontend

Настройка инструментов

Проект мультиплатформенный (должен работать на Windows, Linux и MacOS без костылей вроде Ubuntu for Windows).

Использовать WebStorm или Visual Studio Code. Нужно отключить safe write в IDE.

В браузере должны быть установлены react-devtools, redux-devtools-extension, apollo-client-devtools.

Почему именно эти IDE

• Они больше всего используются в компании, и проект уже настроен для них (так, в WebStorm уже будут включены линтеры и FileWatcher для prettier).

Процесс написания кода

Используется Hot Module Replacement (HMR), что позволяет писать код и сразу же видеть результат (без перезагрузки страницы). Это работает для компонентов приложения и для reducer'ов. Для остального кода страница автоматически обновится. HMR не работает для кода в конструкторе и декорированных функций (в частности, autobind). В таких случаях надо обновлять страницу вручную.

Используются source maps.

Код фронтенда пишется исключительно на typescript.

Сообщение коммита

Номер задачи автоматически подставляется в сообщение коммита, поэтому работать надо в ветке задачи (AB-123). Сообщение коммита валидируется с помощью хуков гита. Оно должно быть вида AB-123: Capitalized subject (префикс задачи с пробелом ставится автоматически).

(Как писать сообщение коммита)[https://medium.com/grisme/%D0%BA%D0%B0%D0%BA-%D0%BF%D0%B8%D1%81%D0%B0%D1%82%D1%8C-%D1%81%D0%BE%D0%BE%D0%B1%D1%89%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BA%D0%BE%D0%BC%D0%BC%D0%B8%D1%82%D0%BE%D0%B2-%D0%B2-git-9ed19ebc5ebf]

Контроль качества кода

Перед коммитом файлы проверяются линтерами, а также прогоняются через prettier с помощью хуков гита (lint-staged). В критических ситуациях хуки можно отключить с помощью --no-verify (использовать с осторожностью).

Почему именно так

• Практика показала, что вывод консоли часто игнорируется, и в итоге ошибки нарастают, как снежный ком.
• Линтеры и prettier выполняются только для staged-файлов