MVVM для веб-разработки

DotVVM — это платформа MVVM с открытым исходным кодом на основе ASP.NET, основанная на Knockout JS. Он прост в использовании, и вам не нужно писать тонны кода Javascript. Для большинства сценариев вам нужен только C# и HTML с CSS.

Представление выглядит так — это HTML, расширенный серверными элементами управления и привязками данных:

<div class="form-control">
    <dot:TextBox Text="{value: Name}" />
</div>
<div class="form-control">
    <dot:TextBox Text="{value: Email}" />
</div>
<div class="button-bar">
    <dot:Button Text="Submit" Click="{command: Submit()}" />
</div>

ViewModel — это класс C#, который выглядит следующим образом:

public class ContactFormViewModel 
{
    public string Name { get; set; }
    public string Email { get; set; }

    public void Submit() 
    {
        ContactService.Submit(Name, Email);
    }
}

Существует также расширение Visual Studio, которое добавляет IntelliSense и шаблоны проектов.

Платформа обрабатывает проверку, локализацию, SPA и другие часто используемые функции. Он поддерживает как .NET Framework, так и .NET Core.

Конечно, MVVM является допустимым "веб-шаблоном", но в настоящее время он имеет очень ограниченное применение.

Основное различие между MVC и MVVM заключается в обновлении данных вашего приложения. Для текущих веб-приложений MVC предпочтительнее, потому что сеть в основном представляет собой одностороннюю связь, а весь пользовательский ввод инкапсулируется с помощью форм.

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

Итак, чтобы сделать это просто. Если вы создаете веб-решение с помощью ASP.NET (или любой другой техники, ориентированной на сервер), используйте MVC. Если вы создаете приложение с богатым пользовательским интерфейсом, используйте MVVM, а если вам не нравится Silverlight, попробуйте решение KnockoutJS для Javascript.

MVVM может хорошо работать в Интернете и в технологии на основе XAML. Технология XAML имеет преимущество в своих потрясающих встроенных функциях связывания. Но с библиотеками JavaScript, такими как Knockout (отлично) и JsViews/JsRender (на которые вам следует обратить внимание после того, как JsViews станет бета-версией).

Чтобы ответить вам конкретно: да, вы можете делать MVVM с веб-приложениями. Это хорошо? Да, если вы используете такую ​​библиотеку, как Knockout (http://knockoutjs.com). Ключи к MVVM заключаются в том, что это простой шаблон разделения, который:

1. разделяет вид (страницу)
2. разделяет модель (необработанные данные)
3. разделяет модель представления (логика представления)

Нигде нет технологии, предписанной MVVM. Представление — это ваш html, ваша структура. Модель — это ваши данные (возможно, JSON). Модель представления — это ваш объект javascript, который отделяет логику для вашего конкретного представления.

Knockout предоставляет средства для ежедневной привязки данных с помощью концепции, которую он называет наблюдаемыми. в основном, думайте об этом как об интерфейсе INotifyPropertyChanged, но для JavaScript. Knockout также поддерживает observableArray (аналог ObservableCollection в XAML). Knockout имеет множество других функций, которые позволяют вам подписываться на события изменения данных, создавать поведение, пользовательскую привязку и многое другое. В любом случае... с Knockout вы получаете совсем немного.

Если вы решите использовать MVVM без такой библиотеки, как Knockout, вы все равно сможете это сделать, но потеряете функции привязки данных и, вероятно, захотите написать что-то самостоятельно. Но я настоятельно рекомендую придерживаться библиотеки, которая сделает это за вас.

Длинный ответ ... но я хотел дать вам достаточно, чтобы начать исследовать.

Для веб-сайта (html) это не очень удобно, поскольку точка mvvm заключается в том, чтобы интерфейс немедленно отражал изменения в модели представления. (через привязку данных/события).

Для веб-сайта изменение модели представления обычно представляет собой публикацию + полную перестройку экрана.
Так зачем беспокоиться..

Однако, если у вас есть веб-сайт AJAX с одной фиксированной HTML-страницей, содержимое которой постоянно обновляется с помощью javascript. Тогда становится интересно.

MVVM — это, по сути, шаблон MVC со специфическими изменениями для поддержки разработки приложений с использованием Windows Presentation Foundation.

Модель — Представление — ViewModel
Модель — Представление — Контроллер

Таким образом, ViewModel является контроллером в MVVM. Узор очень хороший; это позволяет очень легко создавать простые, но мощные приложения, которые легко тестировать и поддерживать.

Если вы хотите использовать MVVM в веб-приложении, которое НЕ является Silverlight, изучите ASP.NET MVC. MVVM также является вариантом, если вы используете Silverlight. Вы даже можете смешивать их, размещая свое приложение Silverlight на веб-сайте MVC.

MVVM полностью приемлем для веб-разработки. Фактически, это рекомендуется для разработки Silverlight. Наша компания с большим успехом использует MVVM + Silverlight для многих наших проектов. Начальная кривая обучения может быть сложной, но как только она щелкнет, она предлагает множество преимуществ.

На мой взгляд, чтобы заставить MVVM действительно работать, вам нужен фреймворк с правильной поддержкой привязки. В противном случае вам придется написать много «склеивающего» кода, чтобы соединить ваше представление и модель представления. Silverlight имеет отличную поддержку привязки, и если все сделано правильно, вы можете исключить большую часть кода программной части в своем представлении, чтобы вся ваша бизнес-логика оставалась прямо в вашей ViewModel.

У Тима Хойера есть несколько отличных руководств и видео по MVVM с Silverlight. Очень рекомендую пройтись по его вещам. http://timheuer.com/blog/articles/getting-started-with-silverlight-development.aspx

Для веб-разработки я бы предпочел MVC. Если это чисто Silveright, то можно рассмотреть MVVM.

У меня есть реализация MVVM для Интернета с использованием различных технологий, Knockout, jQuery, Websockets и .NET. Ознакомьтесь со статьей здесь: http://salmanq.com/blog/using-the-mvvm-pattern-on-web-applications-part-i/2013/02/

MVVM полностью приемлем с WPF, а также с Silverlight. Если вы хотите использовать MVVM для веб-разработки, вам придется написать много кода jscript. В MSDN есть пример того, как это сделать:

Перейдите по ссылке ниже: http://msdn.microsoft.com/en-us/scriptjunkie/hh297451

Как уже упоминалось, Knockout.js — это фантастическая библиотека, которая предоставляет множество функций, необходимых для MVVM. в сети. Я создал составную структуру, которая представляет собой гораздо более полную структуру MVVM. Он имеет сходство с Microsoft Prism и используется в довольно большом и сложном продукте, ориентированном на веб-платформы и мобильные платформы.

Проверьте это: http://danderson00.blogspot.com/2012/08/introduction-knockoutcomposite.html