Skip to content

popular-issues.md

Latest commit

 

History

History
104 lines (57 loc) · 9.49 KB

popular-issues.md

File metadata and controls

104 lines (57 loc) · 9.49 KB

Наиболее распространенные ошибки стажеров на этапе код-ревью.

Общие моменты:

  1. В Readme проекта следует указывать версии плагинов, на которых его писали.

  2. Неверные пути к favicons.

  3. Наличие орфографических ошибок в именах переменных и т.д. Плагин SpellСhecker поможет с поиском ошибок.

  4. Библиотеки лежат обычными файлами, а должны быть установлены через npm или yarn.

  5. Не соблюдение нейминга файлов в стиле lowercase-hyphenated. Правило 3.1.

    Также стоит учитывать исключения (Пример: файл экспортирующий класс, нейминг js файлов (правило 1.4).

  6. Отсутствуют дефолтные значения для аргументов функций, методов класса, pug миксинов.

  7. Прежде чем отключать правило линтера (// eslint-disable-next-line), разберитесь, зачем оно нужно. Не отключайте его без необходимости. И готовьтесь к тому, что вас могут попросить аргументированно обосновать своё решение; почему вы отключили данное правило.

  8. Структура БЭМ блока не соответствует правилу: 1 блок - 1 директория - 1 pug (1 миксин) - 1 css - 1 js.

  9. Использование элементов реализации блока из вне, и блока без pug миксина. Правило 4.4.

  10. Наличие BEM миксов. Правила 4.5 и 4.6.

  11. Файл экспортирующий класс должен называться так же, как и экспортируемый класс.

  12. Нельзя оставлять “закомменченный” код. Правило 1.23.

  13. Неверная сортировка импортов. Правило 1.17.

  14. Неверная сортировка методов класса. Правило 8.5.

  15. Отсутствие префиксов js-. Правило 5.1.

  16. Не модульный JS. Правило 5.5.

  17. Неверный выбор типа BEM модификатора (булевый, ключ-значение).

  Пример: button_type_hidden.

  Hidden - это булевый модификатор, свойство либо есть, либо нет. Ключ для него не нужен. Правильно - button_hidden

  Ключ требуется когда есть вариативность: button_size_big, button_size_middle
  1. Одному DOM элементу должен соответствовать один БЭМ-блок или элемент.
  Неправильно:

  .calculator__button.calculator__plus

  Правильно:

  .calculator__button.calculator__button_action_plus.calculator__button_disabled

Toxin:

  1. Все страницы, кроме UI kit, должны быть адаптированы под ширину от 320 до 1920 пикселей. При большой ширине (1200+) контейнер с контентом растягивать не нужно, страницы должны соответствовать макетам. При маленькой ширине (как на мобильных устройствах), для меню использовать “гамбургер”.

  2. Часто встречаются ошибки в pixel perfect.

  3. Частое несоблюдение стилей макета, т.е. граница у кнопки не градиентная, а сплошная; текст не полупрозрачный, а непрозрачный и т.п.

  4. Отсутствует маска в masked-textfield.

  5. Диаграмма на странице room-details не должна быть просто картинкой. В параметрах нужно передать список значении и построить круговую диаграмму на их основе.

  6. В date-dropdown должен быть один календарь на два инпута.

    Не забывайте проверять как выглядит календарь на мобильных. Если ввод дат вручную в инпуты работает некорректно, то необходимо запретить его. То же самое и для dropdown.

  7. Устанавливать адекватные отступы от края экрана и между смысловыми блоками на странице. Правило 1.13.

    Пример плохих отступов:

    bad indents example

Slider:

  1. Readme описан недостаточно полно. Отсутствует информация о том как подписаться на события слайдера и отписаться от них, с какой версией node и jQuery проект совместим.

  2. Код для клиента и код для демонстрации слайдера находятся в одном продакшн бандле. На выходе код клиента и демонстрационный код должны лежать в разных файлах, чтобы клиент не грузил абсолютно ненужный ему код. Реализовать это можно созданием по одной точке для каждого типа кода.

  3. jQuery находится в продакшн бандле, предпочтительнее, чтобы клиент устанавливал jQuery самостоятельно, подобрав версию, совместимую для нескольких плагинов. Можно подключить jQuery в слайдер через CDN.

  4. На демо-странице для слайдера не соблюдаются стандарты (в первую очередь касается БЭМ, ооп для ts, весь код страницы не должен находиться в одном/двух файлах).

  5. Слайдер ломается при передаче нестандартных значений. Также в слайдере не должны лежать невалидные значения.

    Пример невалидных значений: При min 0, а max 10, шаг не может быть 11.

  6. Необходимо проверять демо на ошибки. Тестировать разного рода значения: большие, маленькие, отрицательные, дробные, невалидные.

Typescript:

  1. В tsconfig должен быть установлен флаг strict: true.

  2. Запрещается добавлять в tsconfig флаги, ослабляющие проверки типов, такие как, например, suppressImplicitAnyIndexErrors, suppressExcessPropertyErrors и подобные.

  3. Запрещается использовать правило @ts-ignore.

  4. Использовать ‘any’ разрешается только в одном случае. Когда у вас совершенно никак не получается затипизировать без использования ‘any’ и вы испробовали все возможные варианты. Также вам ОБЯЗАТЕЛЬНО нужно будет написать подробный комментарий, почему вы не смогли обойтись без использования ‘any’.

  5. Запрещается использовать type assertions, в частности с помощью “as” и non-null assertion operator (оператор “восклицательный знак”).