Frontend

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

Надо использовать 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.

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

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

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

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