Несколько интересностей и полезностей для веб-разработчика (выпуск 8)

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

Riot.js ^[1] — The 1kb client-side MVP framework

^[1]
Немного статистической правды:

Самый маленький среди похожих популярных фреймворков

Самый емкий код (в примере для Todo MVC приложения)

Самый быстрый из существующих

«Материнский» проект Moot ^[2] тоже очень крутой и демонстрирует то, каким должен быть форум.

LNK ^[3] — Responsive Email Framework

^[3]
Сразу хочется сказать о том, что это продукт от ZURB — от создателей Fundation. LNK больше напоминает Skeleton и в нем есть свой Boilerplate, а также несколько готовых лэйаутов ^[4] и небольшой инструмент Inliner ^[5], который отправит вам вашу верстку на почту. На хабре есть ряд статей про верстку почтовых писем и я бы сравнил LNK с набором полезных техник/сниппетов из этих статей. В целом фреймворк очень полезный, а особенно для новичков.

Поддерживает следующие E-mail клиенты:

• Apple Mail (5 and 6)
• Microsoft Outlook (2000, 2002, 2003, 2007, 2010, 2011, 2013)
• Mozilla Thunderbird (3, latest)
• Android Native (2.3, 4)
• iOS Native (6, 7)
• AOL Mail
• Gmail
• Yahoo! Mail
• Outlook.com

Sir Trevor ^[6]

^[6]
Удобный интерфейс редактора. Приятный минималистичный дизайн. Простота использования и широкий выбор настроек.

Установка:

Для работы sit-trevor.js потребуется jQuery, Underscore и Eventable ^[7].

 <form>
  <textarea class="js-st-instance"></textarea>
</form>

<script>
  new SirTrevor.Editor({ el: $('.js-st-instance') });
</script>

Результат:

{
  "data": [{
    "type": "text",
    "data": {
      "text": "Hello, my name is **Sir Trevor**"
    }
  }]
}

Snazzymaps ^[8] — коллекция JS стилей для Google карт

^[8]

Bear CSS ^[9]

До жути простой, а весьма полезный инструмент. Bear CSS забирает все названия классов и идентификаторов с вашего HTML и генерирует CSS. На самом деле намного удобнее, даже правильнее, описывать стили по принципам OCSS и SMACSS, когда видишь перед собой структуру документа. Да, с препроцессорами тоже можно формировать некое дерево, но все равно придется мысленно отвлекаться на описание стилей. Плюс — не тратится время на великое множество копипастов. Советую попробовать. А был бы еще какой-нибудь плагин к Sublime...

BLOKK Font ^[10] — удобное решение для быстрых мокапов.

^[10]

Напоследок:

Алиса в стране чудес

Относительно недавно я писал про «Будущую революцию дизайна контента» ^[16] и вот ^[17] первые предпосылки к тому, как это будет выглядеть: GitHub ^[18] (демо работает в последних сборках WebKit Nightly ^[19] и Chrome Canary ^[20] (в chrome://flags активируйте пункт Enable experimental WebKit features).

• Thorax.js ^[21] — результат качественного «скрещивания» фреймворков Backbone и Handlebars для создания больших масштабируемых приложений (от разработчиков крупнейшей розничной сети в мире Walmart). Также существует Thorax yeoman generator ^[22].
• Drawingboard.js ^[23] — простая в использовании Canvas рисовалка.
• Salvattore.js ^[24] — аналог популярного jQuery Masonry, но с CSS конфигурацией.
• RECESS ^[25] — линтер/компилер для CSS и LESS от команды Twitter.
• Datauri ^[26] — простой и удобный онлайн конвертер изображений в data uri (репозиторий на GitHub ^[27]).
• Noise Texture Generator ^[28] и Long Shadows Generator ^[29] — просто и всегда может пригодиться.
• Actualvim ^[30] — «Sublime Text 3 input mode powered by Vim itself»
• Whenever ^[31] — Cron jobs в Ruby
• CryptoJS ^[32]
• Коллекция юзабельных сниппетов для DevTools ^[33]
• Photo Pea ^[34] — бесплатный онлайн редактор PSD с базовым функционалом.

                                                          Предыдущая подборка (Выпуск 7) ^[35]

Автор: ilusha_sergeevich

Источник ^[36]