Pull to refresh
  • by relevance
  • by date
  • by rating

От Backbone.js к Marionette.js

Website developmentJavaScript
Привет, Хабр.

В этой статье пойдет речь о том, из чего состоит Marionette.js, и о возможности не писать свой велосипед.

Статья рассчитана в первую очередь на работавших с Backbone.js и/или Marionette.js.
Для вновь знакомящихся будет полезна первая, обзорная, часть и ссылки в конце статьи.
Так из чего же состоит Marionette.js
Total votes 17: ↑15 and ↓2 +13
Views60.3K
Comments 11

Введение в Marionette.js Behaviors

Website developmentJavaScript
Sandbox
image

В этом посте вы узнаете о новой фиче Marionette.js — Behaviors.

Очень часто в различных элементах интерфейса у нас встречаются похожие элементы управления (например кнопка «Удалить» может быть и у категорий, и у записей, и в списке зарегистрированных пользователей… да везде), и каждый раз приходится описывать обработчик этой кнопки в каждом View, причем везде одинаково.
Но это уже называется дублирование кода, и не приветствуется в большинстве общества. Поэтому разработчики Marionette.js предоставили нам такую замечательную фичу как Behaviors.

Behaviors предоставляет интерфейс для изолирования описаний взаимодействия DOM с пользователем в отдельные логические куски кода. Behavior может быть применено к любому View любое количество раз.

В этой статье рассмотрим самый тривиальный пример — кнопка «Удалить».
Читать дальше →
Total votes 37: ↑36 and ↓1 +35
Views15.6K
Comments 1

Marionette.js. Drag&Drop сортировка моделей в коллекции

Website developmentJavaScriptjQuery


Достаточно распространенная задача — поменять местами элементы в списке. Но как правило эта задача решается жуткими костылями, особенно если это Drag&Drop.
Сейчас я расскажу вам очень простой и гибкий способ сделать это, используя Marionette.js и jQuery UI Sortable.
Читать дальше →
Total votes 25: ↑21 and ↓4 +17
Views14.3K
Comments 7

Мой web-интерфейс управления умной квартирой

Website development.NET
Привет!

Последние 1.5 года я работаю над очень интересным проектом — это система управления домом по сценариям. Она позволяет навешивать произвольную логику (сценарии) на различные события в доме (срабатывание датчиков, нажатия кнопок, события от внешних сервисов, например, получнеие email или сообщения в twitter). Система имеет модульную архитектуру, весь функционал находится в плагинах. Если нужно добавить новый тип события или новые команды «домашнего API», нужно просто добавить плагин для этого.

В феврале у нас был первый релиз. Первая версия включала фреймворк для домашней автоматизации: систему плагинов и инфраструктуру для них (чтобы плагины могли описывать свой API и события, а также использовать API и подписываться на события друг друга). Сейчас близится релиз второй версии, основная фича которого — новый веб-интерфейс.



UI теперь — модульное одностраничное приложение. Плагины могут описывать свой UI в виде html/js/css файлов, расположенных в ресурсах DLL. Клиентская часть UI основана на backbone.js и marionette.js, модули загружаются через require.js. В целом получилось довольно удобно для авторов плагинов — даже не имея глубоких знаний java script, можно, смотря в примеры, описать полноценный UI, который будет автоматически подключен в интерфейс управления домом.

А теперь - слайды!
Total votes 43: ↑37 and ↓6 +31
Views42.5K
Comments 41

Использование Marionette.Region для создания загрузочных представлений

Website developmentJavaScriptHTML
Sandbox
В клиентских приложениях очень часто возникает необходимость как-то визуализировать процесс загрузки данных с сервера. В этой статье я опишу способ, позволяющий добиться такого поведения за счёт повторно используемой области Marionette.Region в MarionetteJS.

Сразу скажу, что мой подход во многом основывается на подходе автора скринкастов на www.backbonerails.com. Это очень хорошая и полезная серия скринкастов не только (и не столько) с точки зрения того, что обсуждается здесь, но и в целом для изучения MarionetteJS.
Читать дальше →
Total votes 20: ↑19 and ↓1 +18
Views7.9K
Comments 2

CLI для MarionetteJS

JavaScriptNode.JS
Sandbox
Хочу представить свой генератор кода для marionettejs.

image

Я решил написать свой генератор кода для MarionetteJS. Уже существует генератор для yeoman, но ниже я покажу и расскажу о своем генераторе написанном на NodeJS
Читать дальше
Total votes 7: ↑4 and ↓3 +1
Views2.6K
Comments 4

Собираем простое MariontteJS+ES6 приложение с помощью Brunch

JavaScript
Здравствуйте. Я хотел бы рассказать как с помощью Brunch можно собрать MariontteJS+ES6 приложение.



Сегодня уже 2016-й год и способов собирать приложения очень много. Ниже я предлагаю рассмотреть Brunch
Читать далее
Total votes 8: ↑6 and ↓2 +4
Views7.4K
Comments 5

Что нового в Marionette.js 3.0?

Website developmentJavaScript


Прошло более 2-х лет с того времени как 3-я версия начала разрабатываться и вот наконец-то сегодня она была зарелизена! Итак, кому интересно, кто ждал и работает с Marionette.js — добро пожаловать в подкат.

Читать дальше →
Total votes 37: ↑33 and ↓4 +29
Views17.4K
Comments 21

Marionette.js исполнилось 5 лет

Open sourceJavaScriptProgramming

image


11 декабря 2016 Marionette.js исполняется 5 лет. Этот проект постепенно рос все эти годы. Его развивали сотни контрибьюторов, было создано сотни коммитов и десятки сотен проектов, которые используют Marionette. Мы были инновационными и были устаревшими. Мы видели как новые фреймворки приходят и некоторые уходят. Мы, возможно, никогда уже не будем новыми и модными, но мы будем делать все возможное чтобы постоянно двигаться вперед.


Читать дальше →
Total votes 18: ↑18 and ↓0 +18
Views6K
Comments 6