Ratchet (фреймворк) (Ratchet (sjywbfkjt))
Ratchet | |
---|---|
Первый выпуск | 04-2013 |
Последняя версия | 2.0.2 (2 апреля 2014 года[1]) |
Лицензия | MIT License |
Сайт | goratchet.com |
Ratchet — фреймворк для создания и быстрого прототипирования мобильных приложений и мобильных версий сайтов. Основан на технологиях HTML5 и CSS3. Первая версия создана в апреле 2013 года. Текущая версия 2.0.2
Основные компоненты
[править | править код]В пакет фреймворка включены стили, джаваскрипт и шрифты ratchicons, которые используются для отображения иконок. Фреймворк доступен как в скомпилированном виде, так и в виде исходного кода. Стили поставляются в трех пакетах — базовом, заточенном по iOS и заточенном под Android. JS и иконки от платформы к платформе не меняются.
Структура прекомпилированного пакета
[править | править код]CSS
[править | править код]├── ratchet.css ├── ratchet.min.css ├── ratchet-theme-android.css ├── ratchet-theme-android.min.css ├── ratchet-theme-ios.css └── ratchet-theme-ios.min.css
JS
[править | править код]├── ratchet.js └── ratchet.min.js
Fonts
[править | править код]├── ratchicons.eot ├── ratchicons.svg ├── ratchicons.ttf └── ratchicons.woff
Базовые элементы интерфейса, включенные в Ratchet
[править | править код]Экраны в Ratchet строятся на основе базовых элементов, приведенных ниже. Для каждого из элементов фреймворк представляет специализированные классы, которые управляют внешним видом элемента.
- плашка заголовка
- плашка закладок (табов)
- списки элементов плоские
- списки элементов с шевронами
- кнопки
- блочные кнопки (т.н. "большие кнопки")
- сегментированный контрол
- поля формы (текстовое поле, поле поиска, поле электронной почты и textarea)
- всплывающие окна
- модальные окна
- слайдер
Push.js
[править | править код]Страницы связываются между собой с помощью компонента push.js. Этот компонент отличает Ratchet от вебовских фреймворков и дает возможность сделать внешний вид похожим на нативное приложение.
Преимущества и недостатки
[править | править код]Поскольку Ratchet является html5-фреймворком, идеологически он крайне близок html5-фреймворкам для веба. Основное отличие Ratchet от остальных html5-фреймворков для мобильного прототипирования в том, что он позволяет создать интерфейсы под разные платформы (поддерживаются только iOS и Android, остальные не поддерживаются), используя один и тот же HTML-код. Таким образом, все различие во внешнем виде, включая перемещения элементов, происходят за счет CSS и JS.
Преимущества
[править | править код]Основным преимуществом Ratchet считается легкость в освоении этой технологии. За счет идеологической близости к вебу и использования веб-технологий в основе, фреймворк легко осваивается веб-разработчиками. Код Ratchet легко изменять и модифицировать, в том числе используя метаязык Sass, что упрощает работу с фреймворком для фронтенд-разработчиков.
Создателями фреймворка также особенно подчеркивается легкость, с которой можно одновременно создать прототип приложения для двух платформ (технически это выполняется заменой строки кода со стилями без изменения остального HTML-кода).
Критика
[править | править код]Иногда высказывается мнение, что авторы Ratchet больше ориентировались на практики построения интерфейсов, принятые в гайдлайнах для платформы Apple, поэтому внешний вид приложения, которое писалось с андроид-стилями все равно похож на iOS-интерфейс.
Список версий
[править | править код]- 1.0.0 — апрель 2013
- 1.0.2 — июль 2013
- 2.0.0 — февраль 2014
- 2.0.2 — 2 апреля 2014
Обратной совместимости между версиями нет.
См. также
[править | править код]Примечания
[править | править код]- ↑ История версий Ratchet . Дата обращения: 26 апреля 2014. Архивировано 11 октября 2014 года.
Ссылки
[править | править код]- Документация на английском языке (англ.)
- Документация на русском языке (недоступная ссылка) (рус.)
Обзоры
[править | править код]- Ratchet Becomes a Real Framework, Gets a New Home . infoq.com. Дата обращения: 9 мая 2014.
- The Beginner's Guide to Ratchet: A Mobile Web App FrameworkTreehouse Blog . blog.teamtreehouse.com. Дата обращения: 9 мая 2014.
- Ratchet 2.0, Mobile CSS Framework by Bootstrap Organisation . codersgrid.com. Дата обращения: 9 мая 2014.
- Building Mobile Apps for Salesforce.com with Ratchet 2.0 - Christophe Coenraets . coenraets.org. Дата обращения: 9 мая 2014.