Так уж случилось, что в последнее время мне приходится осваивать новые инструменты. Очередным таким инструментом стал webpack.
Инструмент интересный, но после переезда с Google Closure * для меня стало загадкой, почему webpack не ужимает имена классов, как это делает Google Closure Stylesheets.
За день, на коленке, мною был написан plugin который вполне не плохо реализовал этот функционал.
Более подробное описание ниже.
Читать дальше →

CSS-препроцессоры прекрасны, они сделали революцию в мире интернет-вёрстки. Создание кросс-браузерного CSS стало гораздо проще, потому что все вендорные префиксы и хаки можно завернуть в примеси, заглушки или что у вас там. До сих пор этого вполне хватало, но так как мы неистово одержимы контролем, хотим большего. Всегда. БОООООЛЬШЕ. Скажи привет CSS-постпроцессорам!

Postprocessing? я запутался!

Это неудивительно, мне кажется “postprocessing” не слишком подходящим словом, но он вполне способно донести саму суть – CSS-препроцессоры (Sass, Less и т.д.) читают и собирают язык расширения в CSS, тогда как постпроцессоры читают и собирают сам CSS. Это ужасно, простите, но если вы но если было непонятно, то теперь всё должно встать на свои места.

Уже существует несколько постпроцессоров, например – Autoprefixer, PostCSS и rework.

Зачем использовать постпроцессор?

Что ж, давайте возьмём для примера Autoprefixer, он читает ваш CSS и добавляет вендорные префиксы, используя при этом базу данных Can I Use. Представьте, что вы пишете на Sass и хотите применить правило из CSS3, плохо поддерживаемое без префиксов, так что используете примесь:

@mixin box-sizing($value) {
  -webkit-box-sizing: $value;
     -moz-box-sizing: $value;
          box-sizing: $value;
}
.box {
  @include box-sizing(border-box);
}

Почему Autoprefixer лучше? Потому что можно вот так:

.box {
  box-sizing: border-box;
}

Читать дальше →

CSS (Cascading Style Sheets) is a handy tool to separate the presentation from the content of your website — you write the content, and the CSS controls the look and formatting. CSS is great for giving your website a custom look, but it can also become complicated to maintain. The solution to this? CSS preprocessors. [...]

Представляю вам новый open source проект. Надеюсь, что он будет интересен хабраобщественности и IT общественности в целом. Размещаю в блоге PHP, потому что интерпретатор написан на PHP и может быть непосредственно использован для создания решений.
Template Hypertext Preprocessor – Специализированный, cверхвысокоуровневый, скриптовый язык программирования, для генерации динамических блоков html документа. Отличается особым удобством для создания и модификации динамических интерфейсов html страниц, встраивается в язык разметки html с сохранением валидности исходного документа, прозрачен с точки зрения ООП, является платформенно независимым.

Для данного языка программирования реализован интерпретатор, основанный на языке PHP под названием “Template Engine”. Интерпретатор, отличается компонентной многоуровневой архитектурой, создает разумные ограничения работы на уровне спецификации, позволяет запускать голый PHP код и нативные PHP файлы в среде Template Engine. Спецификация THP / Template Engine создана таким образом, что бы максимально упростить разработчикам создание приложений и их расширение, а так же максимально структурировать код.

Видеотуториал

Для тех, кто хочет перейти сразу же к практике я подготовил видеотуториал по установке и объяснению базовых узлов системы. Установкой является: скачать и расположить на сервере, все остальное за исключением паролей БД, должно заработать само. Сайт проекта: http://thp.wartur.ru/



Дополнительная общая информация под катом