Pug - это препроцессор HTML и шаблонизатор, который был написан на JavaScript для Node.js.
neretinaa neretin-trike
Stylus - это препроцессор CSS, который был написан на JavaScript для Node.js.
pwd - вывести рабочий каталог
mkdir [имя папок] - создать папки
rm -r [имя папок] - удалить папки
touch [имя файлов] - создать файлы
touch [имя папки]/{[имя файла],[...]} - создать файлы внутри указанной папки
cd .. | [имя папки] - подняться на уровень вверх | перейти в дерикторию
ls -*a -*l - вывод файлов и папок в текущей директории *вместе со скрытыми *и информацией о размере и дате создания
echo ['текст'] >> [имя файла] - создать файл с указанным текстом
neretin-trike
/ bem.md
Last active
September 23, 2023 04:06
Способ организации код - методология БЭМ
БЭМ (Блок, Элемент, Модификатор) — компонентный подход к веб-разработке. В его основе лежит принцип разделения интерфейса на независимые блоки. Он позволяет легко и быстро разрабатывать интерфейсы любой сложности и повторно использовать существующий код, избегая.
Блок - часть страницы, являющаяся логически независимой от остального наполнения. Представляет собой «строительную единицу» для сайта (на примере конструктора лего - это отдельный «кирпичик»). Блок не отвечает за свое расположение. Он задает внутренние свойства (размеры, шрифты и т.д.).
Элемент - часть блока, которая должна входить в состав блока и не иметь какого-либо смысла отдельно от блока.
Более полное руководство по Markdown синтаксису
Параграфы
<пустая строка>
Текст параграфа. Может быть
разбит на несколько строк.
<пустая строка>
Мета-теги - это служебные слова, которые содержат важную информацию о веб-документе для поисковых систем. В большинстве случаев размещаются внутри тега head.
Список мета-тегов для атрибута name:
description— описание веб-страницы, должно быть достаточно длинным и полнымkeywords— ключевые слова,generator— CMS сайта,author— автор,copyright— авторские права,robots— правила индексирования страницы для роботов,viewport— данные о настройке области просмотра
Используются для того чтобы выбрать элементы в зависимости от того как они связаны с другими элементами на веб-странице.
Комбинатор выбирает элементы, которые находятся внутри указанного элемента (вне зависимости от уровня вложенности).
css
div p {
color:red;
}
Описание существующих контейнеров и списки соотвествующих тегов.
Блочные элементы — элементы высшего уровня, которые форматируются визуально как блоки, располагаясь на странице в окне браузера вертикально. Значения свойства display, такие как block, list-item и table делают элементы блочными. Блочные элементы генерируют основной блок, который содержит только блок элемента. Элементы со значением display: list-item генерируют дополнительные блоки для маркеров, которые позиционируются относительно основного блока.
Список тегов:
<address>, <article>, <aside>, <blockquote>, <dd>, <div>, <dl>, <dt>, <details>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>-<h6>, <header>, <hr>, <iframe>, <li>, <legend>, <nav>, <noscript>, <ol>, <output>, <optgroup>, <option>, <p>, <pre>, <section>, <summary>, <table>, <ul>
Встроенные (строчные) элементы генерируют внутристрочные контейнеры. Они не
neretin-trike
/ checklistcoding.md
Last active
May 30, 2023 21:13
Чек-листы по разработке сайтов и веб-приложений
Для того чтобы отдавать вёрстку клиенту, достаточно обязательного соблюдения первых 5 пунктов. Для выдачи в продакшен — первых 6.
- Соответствие макету
- Кроссбраузерность, кодировка и DOCTYPE
- Валидность (включая CSSLint и JSHint), доступность, микроформаты
- Независимость блоков в CSS: минимизация каскада, использование техник БЭМ
- Сайт должен нормально смотреться во всех стандартных разрешениях от 1024 и выше, не иметь горизонтального скролла и вписываться в экран мобильных устройств
- Корректная работа при вбивании реального текста, надёжность вёрстки
- Использование препроцессоров и систем сборки
NewerOlder