Рубрика «less» - 2

image

Frontend с каждым днём становится сложнее. Задачи — объёмнее, пользовательский интерфейс — насыщеннее, HTML, CSS и Javascript — огромнее, а сон фронтендера — короче и беспокойнее. Необходимо грамотно структурировать код, выполнять множество рутинных задач (компиляция css- и js-препроцессоров, сборка спрайтов, подготовка и оптимизация изображений, минификация файлов и др). Если вы работаете в команде — это автоматически увеличивает сложность разработки. Чтобы решить эти проблемы, я создал TARS — сборщик html-вёрстки, основанный на gulpjs.
Читать полностью »

LessПримерно полгода назад я прочитал статью «Почему стоит использовать препроцессоры». В ней автор описывает преимущества препроцессоров на примере реализации кастомных кнопок. Статья оказалась познавательна и очень интересна. Автор приводил в примеры разные препроцессоры и объяснял, почему остановился на Sass. На счет цвета карандашей и вкуса я не в праве спорить, у каждого свои взгляды. Но еще тогда мне показались не справедливыми описания о том, что Less не достаточно мощный. Еще тогда хотелось сделать что-то подобное, воплотить идею автора на других препроцессорных языках (Less, Stylus). На момент прочтения статьи времени что-то сделать свое не было. И вот недавно, в один из выходных, я вспомнил об этой статье и решил реализовать идею автора — только средствами Less. Делать что-то новое я не видел смысла, поэтому решил помочь автору в развитии проекта, сделал форк с его репозитория, проделал необходимую работу и создал pull request.
Читать полностью »

Лет пять назад подсел на разработку сайтов, причем чисто из интереса к вебу. Хотелось осознать, как их делать и делать лучше, чем другие. Начиналось всё это, как и для большинства разработчиков, с простого познания HTML, CSS и, конечно, популярных CMS, таких как Joomla, WordPress и Data Life Engine. По мере роста приходилось углубляться в Javascript и, конечно, в мой любимый сейчас PHP. Но все шло не так быстро, как хотелось. Тренируясь на простом, хотелось понять сложные вещи. PHP поначалу плохо давался, но характер взял верх и все же через некоторое время написал что-то вроде похожее на мини-социальную сеть.

Ну а затем пошло-поехало: ООП, MVC и, наконец, пришло время покорять фреймворки. На тот момент самыми известными для меня были Zend, Kohana и CodeIgniter. Позже узнал о Symphony и YII. Выбор пал на Kohana, т.к. для новичка была проще в освоении и с нормальной документацией. Ну и недостатков в принципе для себя не видел в этом фреймворке.
Читать полностью »

Эскимо — новый Node.js бойлерплэйт для быстрого прототайпинга (MVP).

Даже если интернет заполнен разными бойлерплэйтами и фрэймворками, на нынешний день отсутствует современный, модульный и минимальный бойлерплэйт для запуска прототипов (специально для строительства rapid minimal product-ов «RMVP's»). Проект создается с малого, одним человеком, но потом, под влиянием вкладчиков, он растет до непредсказуемых размеров. Поиск в Google и GitHub про Nodejs бойлерплэйт и Nodejs фрэймворк дает сотни результатов.

Но многие из этих запускателей проектов не имеют автоматизации для развертывания и тестирования продуктов. Некоторые игнорируют практику фронт-энда и не используют Bower, Bootstrap, Font Awesome, S3/CloudFront, clustering и LESS. И ни один бойлерплэйт или фрэймворк не внедрили инъекцию зависимостей с помощью электролита, за исключением Эскимо и проекта Джареда Хэнсона.
Читать полностью »

Данный пост навеян коментарием уважаемого читателя SerafimArts о том, что LESS много чего не умеет. Хочется развеять эти крамольные заявления и заодно показать, каким прекрасным может быть LESS, если правильно его готовить.

Примечание: некоторые примеры «из жизни» в данной статье предоставлены для тех людей, кто по каким-то причинам (вплоть до религиозных) не использует Autoprefixer.

Примечание 2: для всего, что написано ниже используется последняя версия LESS, потому что нет вообще ни одной причины её не использовать.

Малоиспользуемые, но от этого не менее прекрасные возможности LESS

Слияния

Они же объединения, они же мерджи (Merge). Используются, если вам нужно что-нибудь присоединить через пробел или через запятую. Транзишны, трасформы, множественные бэкграунды, тени (простите за русское слово: бокс-шадоуы звучит как-то неласково) ликуют. Лучше всего за меня скажут примеры.
Читать полностью »

Приветствую всех! Меня зовут Сергей, я живу в Самаре, мне 37 и я бородат, но только тогда, когда сила созидания побеждает во мне все остальные физиологические процессы… Сегодня я поделюсь с вами своим опытом практического использования LESS. Что уж говорить, LESS моден и, как известно, в IT среде используется всеми, кому не лень… иногда даже вопреки здравому смыслу.

Что же такое LESS? Less — язык! Но язык ли это? Говоря словами обывателя-верстальщика: пишем некий код, компилируем его, а на выходе получаем все тот же CSS.
… и тут мне почему-то сразу вспомнилось выражение коллеги-программиста Феди, с которым мы в шутку каждый раз испытываем мировоззрения друг друга. Так вот, он говорил: «Долой рюшечки! Вперед функционал!» Понятно, что для дизайнера эти слова — просто «ножом по сердцу».

Но мы немного отвлеклись и, в общем, суть не в этом.
Читать полностью »

Pug pug!, или Как прошла первая встреча PHP User Group

Днепропетровский офис DataArt принял первую встречу сообщества PHP-разработчиков. Перед презентациями гостей встречал мимимишный мопс Чупик — главный герой нашего видеоприглашения на встречу. Которая, кстати, собрала более полусотни девелоперов, которые с огромным удовольствием прослушали четыер доклада о РНР и как с ним жить.
Читать полностью »

На конференции //build/ у меня был доклад о Visual Studio Web Tools и расширении Web Essentials. Вы можете найти этот доклад онлайн на сайте Channel9. Во время доклада я использовал несколько расширений, которые будут полезными для любого веб-разработчика Visual Studio 2013. Ниже вы найдете список этих расширений.

Web Essentials

logoСайт: http://vswebessentials.com
Загрузить: Web Essentials в галерее VS

Это расширение команды ASP.NET и Web Tools, которое является неофициальной площадкой для тестирования и обкатки функций. Само расширение развивается opensource-сообществом. Web Essentials предлагает огромное число новых возможностей для веб-разработчиков, такие как компиляторы LESS/Sass/CoffeeScript, дополнительные возможности работы с кодом JavaScript/CSS/HTML/JSON, валидаторы, генераторы спрайтов изображений и многое другое.

SideWaffle

imageСайт: http://sidewaffle.com
Загрузить: SideWaffle в галерее VS

Очень вкусное дополнение для Visual Studio. Это отличный набор шаблонов, который содержит как шаблоны проектов, шаблоны элементов, так и сниппеты для широкого круга сценариев: от создания приложений Angular.js, проектов Nancy FX, Browser Link, расширений Chrome и многого другого.
Читать полностью »

Вот и настало время весеннего обновления WebStorm, нашей IDE для front-end разработки и Node.js.
В новом WebStorm 8 появились поддержка фреймворка AngularJS, JavaScript-трейсер spy-js, долгожданные множественные курсоры в редакторе, интеграция Grunt и Bower и еще много интересных нововведений и улучшений.
Теперь обо всем по порядку.
image
Читать полностью »

Почему стоит использовать препроцессорыУ меня достаточно неплохой опыт в верстке — несколько лет.
За это время было многое — и табличная верстка, и собственные фреймворки, и IE6, и адаптивный дизайн, да что угодно — я всегда старался быть рядом с bleeding edge, как говорится.
Больше CSS-фреймворков (привет, бутстрап) и Emmet-а мне нравятся препроцессоры и я расскажу, почему. Возможно, покажется, что моя статья несколько устарела и сейчас все используют препроцессоры как само собой разумеющееся, но, увы, это не так. Недавно я встретил человека, который говорил о том, что ему быстрее писать CSS-код, нежели использовать препроцессоры. Мы долго спорили, на самом деле, ну очень долго, в итоге я решил выложить свои мысли здесь, в одном месте.

Less или Sass?

Ну, на самом деле, это дело каждого. Мне не нравился Sass из-за его медлительности — Less побыстрее выполнялся всегда, в итоге в один момент я решил перейти на Less, но через некоторое время оказалось, что мне не хватает его мощности! Увы, я так и не нашел, как реализовать банальный миксин уровня вот этого.
Но и медлительность Sass не устраивала, но именно в тот момент, когда я хотел обратно вернуться на Sass, но терзался сомнениями, мне посоветовали libsass, а т.к. я использую Grunt — мне было достаточно подключить только grunt-sass (и ничего больше, например, установка Ruby и гемов). Для меня выбор был ясен и с тех пор — только libsass. Мощность самого Sass и с скорость C — что еще нужно?
Stylus я пока не пробовал, как-нибудь потом.

Почему все-таки препроцессоры?

Я не скажу ничего нового, скорее всего, но я хочу показать, почему стоит использовать препроцессоры.
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js