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

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

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

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

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

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

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

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

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

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

Урок 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 читать дальше…

Рисую танглы

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

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

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

Урок 2. Работа с файлами

Здравствуй, друг! 🙂 В этом уроке рассматривается работа с файлами в Gulp, который должен быть установлен в проекте. Это продолжение, начало в первом уроке. 1. Создаем в корне проекта папку srs И уже в ней: 1.1. Папку js с файлами index.js и class.js 1.2. Папку читать дальше…

Урок 1. Что такое Gulp и его установка

Привет! С этой статьи / поста начинается серия моих конспектов, которые написаны во время прохождения курса по Gulp. Думаю, они могут быть полезны 🙂 GULP — это таск-менеджер (таск — task — задача) для автоматического выполнения часто используемых задач, написанный на языке программирования JavaScript. Программное обеспечение использует командную строку для запуска задач, читать дальше…