Профилактика багов
Как исправить баг
Управление багами
Самый простой способ борьбы с багами — не допускать их появления ещё при написании кода. Для этого программисты придумали стили кодирования и линтеры.
Стили кодирования
Код без форматирования и структуры тяжело читать и мучительно поддерживать. В каше из тегов или селекторов легко допустить ошибку: не закрыть див, пропустить лишнее свойство или сломать атрибут.
Без форматирования
<div class="lid">
<h1>
Как кофе делает счастливым</h1></div><p clas=
"main_discription">Изучили исследования...</p>
</div>С форматированием
<div class="lid">
<h1>Как кофе делает счастливым</h1>
</div> <!-- Див рано закрылся -->
<!-- Опечатка в атрибуте clasS -->
<p clas="main_discription">
Изучили исследования...
</p>
</div>
Без структуры
.score, .badge
.counter {
position: relative;
font-size: 16px;
float: left;
margin: 13px 0;
vertical-align: middle;
background-color: #fff;
border-radius: 20px;
z-index: 10;
font-size: 12px;
text-align: center;
line-height: 14px;
}
Всё по группам
.score,
/* Забыли запятую, сломался селектор */
.badge,
.counter {
position: relative;
z-index: 10;
float: left;
margin: 13px 0;
padding: 14px 0;
text-align: center;
vertical-align: middle;
background-color: #fff;
border-radius: 20px;
/* Размер шрифта задан дважды */
font-size: 12px;
font-size: 16px;
line-height: 14px;
}
Чтобы минимизировать количество таких ошибок, программисты придумали стили кодирования — стандарты оформления кода. В них описывают, как форматировать, структурировать и организовывать код и комментарии, какую использовать систему именования, какого кода стоит избегать.
Стили кодирования — отличные учебники для начинающих. Чтобы научиться писать чистый и поддерживаемый код на ХТМЛ и ЦСС, советую изучить популярные стили кодирования:
Линтеры
Чтобы за стилем кодирования следили роботы, а не люди, программисты придумали линтеры — программы, автоматически проверяющие код на соответствие выбранному стилю кодирования.
Большая часть линтеров подсказывает исправления прямо в редакторе и по просьбе могут самостоятельно поправить код:
Другие — не дают сохранить код в репозиторий, если у него есть проблемы со стилем. Третьи — автоматически форматируют код при его сохранении:
Советую, если есть возможность, использовать линтеры последнего типа: они прилично экономят время и быстрее помогают находить ошибки.
Ещё по теме
P. S. Это был совет о веб‑разработке. Хотите знать всё о коде, тестах, фронтенд‑разработке, цеэсэсе, яваскрипте, рельсах и джейде? Присылайте вопросы.