less урок 3
Урок 3. Компиляция на Node.js

Привет! В этом уроке сделаем компилятор на Node.js. Напомню, что Node.js должен быть установлен, в чём вам поможет статья Как установить Node.js и проверить его работу. 1. Создаем папку less Устанавливаем в неё пакет less через командную строку Windows или Open Server: 1.1. Команда: npm читать дальше…

less 2
Урок 2. Компиляция на клиенте

Привет! В этом уроке рассказываю о том, как сделать компиляцию LESS на клиенте, что означает — непосредственно в браузере. Вариант 1. Компиляция LESS через консоль 1. Создаём папку, допустим, по названию урока, less 1.1. Устанавливаем плагин LESS в папку проекта, локально, с помощью команды в консоли: читать дальше…

less урок 1
Урок 1. Что такое LESS

Привет! Начинаю публиковать уроки по LESS, это мои конспекты, местами дополненные информацией из официальной документации. LESS (Leaner Style Sheets — компактная таблица стилей) — это препроцессор CSS, позволяющий писать ясный CSS с использованием программных конструкций вместо статических правил, т.е. является динамическим языком стилей. Less разработан Alexis Sellier под влиянием читать дальше…

openserver-nodejs
Как добавить Node.js на OpenServer

Привет всем! Обращаться к Node.js из командной строки Windows, когда проект создается на OpenServer, неправильно, поскольку у последнего имеется своя консоль, через которую и логичнее работать. Подружить Node.js и OpenServer очень просто. Если у вас еще не установлен Node.js, то прочитайте статью Как установить Node.js читать дальше…

nodejs-download
Как установить Node.js и проверить его работу

Привет! В этой статье расскажу, как установить Node.js. Причем не важно, какая у вас система — Windows или macOS. Node.js — это технология, программная платформа, позволяющая писать серверный код на языке JаvaScript. Она представляет из себя компилятор, построенный на движке V8, зашитый в Google Chrome. читать дальше…

less-syntax-highlighting
Как сделать подсветку LESS в Sublime Text 3

Привет, друзья! Проходила курсы по основам Nodejs, Gulp и сейчас LESS, в которых было много примеров с less кодом. Этот код отображался белым цветом, потому что Sublime Text не понимал, что это за код. И почему бы сразу не поставить LESS, ведь сделать это очень читать дальше…

gulp 5 lesson
Урок 5. Gulp browser-sync & watch

Привет, друг! Плагин browser-sync запускает сервер, дает выполнить приложения и перезагружает все файлы самостоятельно, без нашего участия, а метод watch отслеживает обработку задач. Когда мы вносим любые изменения в less файл, сборка файлов происходит динамически, налету. Это очень удобно, не нужно принудительно обновлять браузер или нажимать читать дальше…

gulp урок 4
Урок 4. Добавим ещё плагины Gulp

Привет! Продолжаю уроки по Gulp (здесь весь раздел). Сегодня установим плагины: gulp-clean-css — сжатие кода gulp-if — проверка на условия gulp-debug — отладчик Добавим html файлы в папку public, и сделаем это с помощью задачи gulp.task(‘html’): Плагин gulp-clean-css 1. Установим плагин gulp-clean-css для уменьшения / сокращения bundle.css.Команда в консоли: npm читать дальше…

Танглы
Рисую танглы

Привет, друзья! Мне нравится рисовать различные рисунки в виде орнаментов и танглов. Бывает это периодами, когда берусь за рисование, а потом наступает затишье — перехожу на другие занятия. Совмещать увлечения на постоянной основе не удается. Думаю, важнее к ним возвращаться, чем забрасывать полностью 🙂 Недавно читать дальше…

gulp 3 урок
Урок 3. Подключение плагинов и сборка LESS файлов

Привет! 🙂 В этом уроке говорим о подключении плагинов — именно они реализуют весь функционал для ускорения вёрстки. Все уроки по Gulp находятся в разделе Gulp, а предыдущий урок здесь. 1. Создаем src/less/index.less И пишем произвольные стили на less: 2. В gulpfile.js 2.1. Подключаем gulp-less читать дальше…

Top