Есть ли JavaScript MVC (микро) фреймворк? [закрыто]

133

Существуют ли клиентские JavaScript MVC (микро) фреймворки?

У меня довольно сложная форма HTML, и она будет полезна из шаблона MVC.

Я полагаю, что хорошее решение могло бы обеспечить следующее:

  • Model и View обновляют контроллер при изменении значений (шаблон Observer)
  • Заполните модель из данных формы при загрузке страницы
  • Заполните форму из модели при изменении модели

Аякс, комета, JSONP и весь этот джаз - это серьезное излишество.

javascript model-view-controller forms nicholaides
источник
2
Я ошибаюсь или это просто плохая идея (или, может быть, фреймворк совместим с модным словечком)?
2
Я начал работать над чем-то недавно, потому что у меня было такое же чувство, как и у вас. Он настолько же минимален, как и AMD, и настолько незаметен, насколько я мог это себе представить. Это означает, что нет jQuery и т. Д. Я знаю, что это было закрыто сейчас, но я думаю, что это может быть то, что вы искали: github.com/Wolfy87/tarmac - я не так много сделал с этим в последнее время, потому что я думал, что я был бы единственным пользователем.
Olical
github.com/yuval-a/ZOE
Юваль А.
Взгляните на TodoMVC , который сравнивает (почти) все доступные JavaScript-фреймворки, внедряя простое приложение TODO.
Коппор

Ответы:

71

Магистраль - отличный легкий каркас. Попробуйте: http://backbonejs.org/

Martin Drapeau
источник
2
Я так рад, что нашел Backbone.
Аарон Гринли
Я согласен, один, чтобы проверить определенно!
Айвенго
Как использовать Backbone способом MVC?
IsmailS
1
@ TristanJuricek есть ли бесплатная альтернатива peepcode?
Мэтт
Пропустите Backbone и идите прямо к позвоночнику. У него гораздо более логичная реализация MVC.
Крис Джейнс
33

JavaScriptMVC - отличное решение. Это все, что плагин подход позволяет вам выбирать только те функции, которые вам нужны. Начиная с версии 2.0 он основан на jQuery.

Что касается постепенного улучшения вашего сайта, это остается за пользователем, поскольку JMVC предоставляет лишь средний уровень для разработки - вы сами можете сделать этот выбор дизайна.

Однако JavaScriptMVC - просто лучшая библиотека JavaScriptMVC общего назначения из-за ее мощных контроллеров, основанных на делегировании событий.

Делегирование событий позволяет вам избежать необходимости прикреплять обработчики событий и просто создавать правила для вашей страницы.

Наконец, JMVC - это намного больше, чем архитектура MVC. Все части цикла разработки покрыты:

  • Генераторы кода
  • Комплексное тестирование Selenium и Env.js
  • Механизм документации
  • Автоматический Конкат + Компресс
  • Обнаружение ошибок и отчетность
Джастин Мейер
источник
1
+1 для JavascriptMVC - я уже использовал его для нескольких приложений, и это довольно мило. Пропустите примеры генерации кода на сайте. Я полагаю, это только для того, чтобы успокоить фанатов Rails. :) Начните с базовой объектной модели JQueryMX и создайте контроллер.
Крис Джейнс
1
Так как я сделал этот комментарий, я переключился на использование Require и Spine. В конечном итоге они меньше, элегантнее и менее «корпоративны», чем JMVC. JMVC было хорошо для нашей команды Java-разработчиков внести корректировку в JS, но он просто не выдерживает, когда вы начинаете лучше понимать JS ...
Крис Джейнс
MVC часть JMVC теперь can.js
PHearst
21

У Spine есть API, похожий на Backbone, но он намного меньше. Он имеет прототип наследования.

Коля
источник
2
Он также написан на CoffeeScript и использует классы в стиле CoffeeScript - не то чтобы это был огромный выигрыш, но это довольно приятно.
платный ботаник
1
Я полагаю, поэтому он меньше, чем позвоночник? Coffeescript код более компактен ...
Бренден
Я люблю позвоночник. Используйте его с RequireJS для чистой удивительности. Пусть вас не пугает тот факт, что это CoffeeScript, он тоже отлично работает с обычным JS ...
Крис Джейнс
Браузер поддерживает IE> = 9, поэтому убедитесь, что он соответствует профилю ваших посетителей.
Ричард
20

AngularJS хорошо работает вместе с jQuery и поможет вам со структурой MVC и строгим разделением задач.

Полная среда тестирования и внедрение зависимостей включены ...

Проверьте это на http://angularjs.org

Войта
источник
Angularjs является лучшим на конец 2013 года .... Я думаю ....
Тони Бао
15
угловой не является микро рамкой: /
iConnor
1
Согласитесь, Angular не является микро-фреймворком.
Войта
2
да, кривая обучения также непропорциональна, это дает преимущества по сравнению с другими системами.
vsync
4
угловой является полной противоположностью микро рамки. это зверь
hasen
14

Действительно, есть: http://www.javascriptmvc.com/

Я думаю, вы найдете это достаточно!

Филип Экберг
источник
Этот сайт имеет мигающий тег. o_0
Тэд Донаге
этот сайт не загружается для меня вообще
Джош
1
Попробуйте еще раз, должно работать снова.
Филипп Экберг
14

Я думаю, что это выглядит как то, что вы должны проверить: http://knockoutjs.com/

(Как программист silverlight / wpf именно эта библиотека заставила меня наконец начать изучать javascript. Она основана на шаблоне Model-View-View-Model (MVVM), поскольку для меня сейчас это хороший выбор!)

Larsi
источник
Как программист silverlight / wpf я оценил нокаут, позвоночник и пару других. В конце дня я перешел на Angular. У него есть привязки и многое другое.
Jonperl
8

ember.js

Вот три функции, которые делают Ember радостью использования:

  1. Наручники
  2. Вычисленные свойства
  3. Автообновление шаблонов

Наручники

Используйте привязки, чтобы синхронизировать свойства двух разных объектов. Вы просто объявляете привязку один раз, и Ember обеспечит распространение изменений в любом направлении.

Вот как вы создаете привязку между двумя объектами:

MyApp.president = Ember.Object.create({
  name: "Barack Obama"
});

MyApp.country = Ember.Object.create({
  // Ending a property with 'Binding' tells Ember to
  // create a binding to the presidentName property.
  presidentNameBinding: 'MyApp.president.name'
});

MyApp.country.get('presidentName');
// "Barack Obama"

Привязки позволяют вам спроектировать ваше приложение, используя шаблон MVC (Model-View-Controller), а затем спокойно, зная, что данные всегда будут правильно передаваться от слоя к слою.

Вычисленные Свойства

Вычисленные свойства позволяют вам рассматривать функцию как свойство. Вычисляемые свойства полезны, потому что они могут работать с привязками, как и любое другое свойство.

Автообновление шаблонов

Ember использует Handlebars, семантическую библиотеку шаблонов. Чтобы взять данные из вашего приложения JavaScript и поместить их в DOM, создайте тег и поместите его в свой HTML, где бы вы ни хотели видеть значение:

<script type="text/x-handlebars">
  The President of the United States is {{MyApp.president.fullName}}.
</script>
Сэм Хаслер
источник
2
Желательно использовать поверх магистрали любым способом .... если спецификации не так ясны на начальных этапах ..
Bijendra
4
Мне нравится emberJS, но это не «микро», это ОГРОМНО, потому что это плоский фреймворк
iConnor
1
Использование Ember и микрорамок в одном предложении не должно быть разрешено.
префикс
8

Stapes.js

Полное раскрытие: я автор этой библиотеки :)

Если вы ищете что-то действительно крошечное (1.5kb minified / gzipped), посмотрите, и скажите мне, если вам это нравится.

хриплый
источник
Отлично смотрится с первого взгляда! Мне нравится ваш акцент на наследовании прототипов (без смоделированных классов и без запутанного newоператора). То , что кажется ненужным является еще одним eachи map. У меня уже есть они в Underscore.js и jQuery .
Фекли
7

Если ваши требования действительно просты, вы можете написать свой собственный простой MVC, как Алекс Неткачов .

Его примеры построены на dojo (Примечание: они не работают для меня на его странице из-за отсутствия файла dojo.js), но вы можете следовать шаблону в простом Javascript.

системная пауза
источник
4

Это, вероятно, излишне для того, что вам нужно, но SproutCore - это инфраструктура MVC, и она не выглядит более тяжелой, чем JavaScriptMVC или TrimPath Junction .

К сожалению, ни один из них, кажется, не построен на принципе прогрессивного улучшения .

системная ПАУЗА
источник
1
Основные MVC-компоненты JavaScriptMVC примерно на 1 Кб больше, чем gzipped Backbone (хотя и обладают рядом дополнительных функций). И JMVC полностью способен создавать прогрессивно улучшенные приложения. Вы бы просто выбросили слой модели.
Джастин Мейер
3

Популярная платформа ActionScript MVC PureMVC была недавно портирована на JavaScript. У меня еще не было возможности попробовать это, но я уверен, что это хорошо.

Рики
источник
Мне нравится это для flex. Просто и мощно.
Гленн
3

Пожалуйста, также проверьте jquery-claypool .

jquery-claypool - это небольшая, быстрая, рельсовая инфраструктура mvc, построенная на jquery, основанная на моем опыте работы с django, rails, spring и т. д. Она очень легкая и работает как на клиентских, так и в серверных средах.

это обеспечивает структуру маршрутизации для чистого mvc, регистрации категорий, фильтров (aop), ленивого создания контроллеров, инверсии управления, соглашения по конфигурации и не намного больше по дизайну.

он не делает ничего, что jquery уже делает, ощущается как jquery и работает как хорошая структура: просто.

JQuery-Клейпул

Надеюсь, вы это проверите.

Крис Тэтчер
источник
Как вы видите Claypool по отношению к Backbone?
Пепийн
2

Джамал - самый легкий из всех, кого я видел. Он также основан на jQuery (бонус). Не использовал.

http://jamal-mvc.com/

KevBurnsJr
источник
2

Если вы хотите держать вещи под контролем и быть достаточно простыми, вам может не понадобиться интегрированная среда, а просто реализовать собственный шаблон mvc. Просто проверьте эту статью: модель-представление-контроллер (MVC) с JavaScript от Алексея Неткачова в 2006 году.

Batailley
источник
2

Попробуйте котенка . Это всего лишь 1,4 КБ, и его единственной зависимостью является EJS.

оборота msn0
источник
2

ОБНОВЛЕНИЕ 2016: Sammy.js, кажется, заброшен.

Посмотри на Sammy.js

Текст с сайта:

Небольшая вебкамера с классом.

  • МАЛЕНЬКИЙ ядро Сэмми сжато только на 16 КБ, сжато на 5,2 К и сжато
  • МОДУЛЬНАЯ Sammy построен на системе плагинов и адаптеров. Включайте только тот код, который вам нужен. Также легко извлечь свой собственный код в повторно используемые плагины.
  • ЧИСТАЯ Весь API был разработан, чтобы быть легким для понимания и чтения. Сэмми пытается поощрять хорошую инкапсуляцию и дизайн приложений.
  • Веселье Что такое реальная точка развития, если это не приятно. Сэмми пытается следовать подходу MATZ. Это оптимизировано для счастья разработчика.
Биджан
источник
Не могли бы вы рассказать, что такое MATZ?
kstep
Юкихиро «Матц» Мацумото, создатель ruby, часто говорил, что он «пытается сделать Ruby естественным, а не простым» способом, отражающим жизнь. Таким образом, программное обеспечение должно быть естественным для пользователя. Это подразумевается под подходом MATZ.
Биджан
1

CorMVC, легко понять и начать, основанный на jquery и не зависит от какой-либо серверной технологии

epitka
источник
1

Я разработал очень простую инфраструктуру Javascript MVC под названием MCV . Он не делает именно то, что вы просите, но его легко расширить с помощью помощников. Во всяком случае, это определенно микро (1,9kb упакованы).

Это работает более или менее как Джамал, но я решил свернуть свой собственный по двум причинам:

  • удалить зависимость jQuery (хотя я использую ее вместе с jQuery большую часть времени)
  • делая его расширяемым с помощью помощников. Это аналог поведения CakePHP, его компонентов и помощников.
Andrea
источник
1

Просто чтобы сделать список немного более полным: ActiveJS

Bijan
источник
1

Я проголосовал за AngularJS (полное раскрытие, я ограниченно вовлечен в усилия по разработке угловых приложений) и очень рад этому. Я провел параллельное сравнение, взяв одну функцию для внутреннего проекта (извините, у меня нет подписи, чтобы поделиться ею) и реализовав ее как в AngularJS, так и в Backbone. Это было отличное упражнение, и в итоге я очень сильно склоняюсь к Angular. Разработчики ядра прекрасно умеют отвечать на вопросы, и они проделали отличную работу со встроенной привязкой данных, тестированием модулей / e2e и документацией. Это все еще в бета-версии с 1.0, выходящим в ближайшем будущем. Бета очень стабильная.

Существует некоторая смена парадигмы, и они используют совершенно иной подход, чем большинство. Интеграция ваших любимых плагинов jquery требует немного усилий, но выполнима и уже выполнена (angular-contrib на github).

Я скажу (а это проблема для большинства js-centric-фреймворков), обязательно изучите, как сделать ваш контент SEO-дружественным (если это важно для вас). Со времени присоединения к сообществу angular в июне я заметил, что интерес растет, и многие люди публикуют сообщения о том, что они смотрели на Backbone и других, но им действительно нравится то, что они видят в Angular.

Дэн Дойон
источник
0

Существовал JavaScript-фреймворк привязки ключ-значение под названием «Coherent», который был вдохновлен Apple Cocoa Bindings. Каркас был куплен Apple, но все еще есть старая копия на http://github.com/trek/coherentjs/tree/master .

Стив Харрисон
источник
0

Can.js имеет все необходимое и весит всего 8 КБ. Он взял лучшие биты из JavaScriptMVC и превратил его в один маленький, но потрясающий фреймворк с наблюдателями, виджетами, связыванием, работами. Он совместим с основными фреймворками ( jQuery , Dojo Toolkit , MooTools и т. Д.). Документация отличная, и авторы отзывчивы. Это определенно стоит посмотреть.

Стивен Гарсия
источник