Давно хотел попробовать Haml, но всё не было времени. Но вот недавно обнаружил новый шаблонизатор, который мне сразу понравился. По словам создателей, он взял лучшее от Jade и Haml. Основная задача — сократить объем кода, при этом не делая его страшным и непонятным.

Вот так выглядит пример шаблона с использованием Slim:

doctype html
html
  head
    title Slim Examples
    meta name="keywords" content="template language"

  body
    h1 Markup examples
    #content.example1
      p Nest by indentation

    = yield

    - unless items.empty?
      table
        - for item in items do
          tr
            td = item.name
            td = item.price
    - else
      p No items found

    #footer
      | Copyright © 2010 Andrew Stone

    = render 'tracking_code'

    script
      | $(content).do_something();

	Erb
	HAML
	Другое

Проголосовало 60 человек. Воздержалось 72 человека.

Наверное каждый в начале работы с ROR был впечатлен возможностью Scaffolding'а, который позволяет одной командой создавать migrations, controllers, models и views.

Но что делать если в своем проекте вы используете не стандартные Rails утилиты: erb, Test::Unit, fixturies, а сторонние инструменты: Haml, Rspec, Cucumber, Factory Girl и более того, хотите добавить собственные шаблоны?

Интересно? GOTO next line.

Исходные данные:
Ruby on Rails; Rspec; will-paginate; Haml; Factory-girl

Задача:
% rails generate scaffold post post:string
Генерирует:

1. contoller's с поддержкой will_paginate, русскоязычными сообщениями
2. model's с поддержкой will_paginate
3. view's с заданным нами содержимым и в формате haml
4. Rspec тесты, вместо Test::Unit
5. Factory Girl factories вместо стандартных fixtures

В эту субботу состоится очередной донецкий кофе-и-код.

Впервые у нас будет англоговорящий докладчик, Keith Gaddis, который является активным участником встреч рубистов в Остине, столице Техаса, который он решил покинуть на время гиковской вакханалии на ежегодном SXSW. Keith — CTO компании Inductive Applications, которая занимается медицинским программным обеспечением. Говорить он будет о рефакторинге RoR-кода и часть названия его доклада перевести на русский трудно: «Refactoring WTF into OMG — стратегии успеха».

Я поделюсь своим опытом быстрого прототипирования при помощи Compass, Haml и Sass. Эти технологии растут из RoR, но это не мешает применять их и отдельно.

Зарегистрироваться на встречу можно на http://cnc.dn.ua/. Там же со временем появятся слайды и ссылки по темам.

Последнее время я практически не занимался версткой, и пропустил выход Sass3, в котором реализовано расширение SCSS (Sassy CSS). Это именно расширение для CSS без «искажения» синтаксиса — то есть любой валидный CSS документ является и полностью валидным SCSS документом. В посте я проведу сравнение с уже существующими препроцессорами такими как Sass и Less. О которых уже писалось на хабре: Sass, Less. Но та информация немного устарела: в частности изменился синтаксис Sass.

Быстрая разработка

Вдохновленный постами на западных блогах вроде «Clone TinyURL with 40 lines of Ruby» или «Clone Pastie in 15 Minutes with Sinatra & DataMapper» я решил попробовать пройти и заодно описать весь процесс реализации легковесного веб-приложения на руби, от проектирования до деплоймента.

Что такое Haml/Sass?

Haml (xHTML Abstraction Markup Language) это язык разметки для упрощённой генерации xHTML. В свою очередь эквивалент Haml для css — это Sass (Syntactically Awesome StyleSheets).

В данной статье я расскажу чем примечателен Sass. И с помощью чего sass-файл можно скомпилировать в css.

	Erb
	HAML
	Markaby
	Liquid
	Erector
	НЛО

Проголосовало 85 человек. Воздержалось 26 человек.

XOWML, — новый язык разметки, разработанный в студии Onlyweb. Читается, — хоумл.

Язык имеет единственное предназначение, — дать XHTML верстальщику возможность быстро и эффективно писать валидный XHTML код. Т.е. работает это так: пишешь код в XOWML, нажимаешь сохранить, автоматически появляется .html файл, его можно просматривать в браузере.

Вот первые примеры XOWML:

.BriefDescription{{
.Image{%img src="images/elephant.jpg" width="240" height="181"{}}
.Description{
.Date{10 августа}
%p{В этой плашке пишем краткую аннотацию, о статье.
Это позволит поситителям сайта понимать о чём идёт речь.}
%p{Надо сразу определится и размерами фотографии.
Необходимо жёстко зафиксировать ширину (я предлогаю использовать ту что сейчас)
а высота фото может меняться без ущерба для внешнего вида страницы.
А без фото на внутренних будет плохо — изначально дизайн соориентирован
на получ. инф. и быстрый прогруз.}
%a href="#"{читать полностью...}
}
.Clear{}
}}

Преобразуется в XHTML код:

<div class="BriefDescription"><div class="BriefDescriptionInside0">
<div class="Image"><img src="images/elephant.jpg" width="240" height="181" /></div>
<div class="Description">
<div class="Date">10 августа</div>
<p>В этой плашке пишем краткую аннотацию, о статье.
Это позволит поситителям сайта понимать о чём идёт речь.</p>
<p>Надо сразу определится и размерами фотографии.
Необходимо жёстко зафиксировать ширину (я предлогаю использовать ту что сейчас)
а высота фото может меняться без ущерба для внешнего вида страницы.
А без фото на внутренних будет плохо —
изначально дизайн соориентирован на получ. инф. и быстрый прогруз.</p>
<a href="#">читать полностью...</a>
</div><!-- .Description -->
<div class="Clear"></div>
</div></div>