.net - MVVM para desarrollo web

silverlight jsrender

Question

He estado leyendo sobre MVVM y hasta ahora lo he encontrado muy interesante. La mayoría de los ejemplos que he encontrado, sin embargo, son para aplicaciones de Windows, a diferencia de las aplicaciones web. También he visto muchas menciones de MVVM usado con Silverlight, y sé que Silverlight puede usarse para aplicaciones Web o Windows.

Entonces mi pregunta es: ¿MVVM es un patrón válido para las aplicaciones basadas en web? Si es así, ¿la interfaz de usuario debe ser Silverlight? Estoy en el proceso de decidir qué tecnologías usar para un nuevo sitio web de tamaño mediano que necesitamos diseñar, y Silverlight puede ser difícil de vender a los poderes fácticos, aunque lo que usamos detrás de escena no importa tanto.

Cualquier información que cualquiera pueda proporcionar sobre el uso de MVVM en un entorno web sería apreciada. El código de ejemplo sería genial también.

Answer 1

DotVVM es un framework MVVM basado en ASP.NET de código abierto basado en Knockout JS. Es fácil de usar y no tienes que escribir toneladas de código Javascript. Para la mayoría de los escenarios, solo necesita C # y HTML con CSS.

La vista se ve así: es un HTML extendido con controles de servidor y enlaces de datos:

<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>

El modelo de vista es una clase C # que se ve así:

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

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

También hay Visual Studio Extension que agrega IntelliSense y plantillas de proyectos.

El marco maneja la validación, localización, SPA y otras características de uso frecuente. Es compatible con .NET Framework y .NET Core.

Answer 2

MVVM es esencialmente el patrón MVC con cambios específicos para apoyar el desarrollo de aplicaciones que usan Windows Presentation Foundation.

Modelo - Ver - ViewModel
Modelo - Vista - Controlador

Entonces el ViewModel es el Controlador en MVVM. El patrón es muy bueno; hace que sea muy fácil construir aplicaciones que sean simples pero potentes, y que sean fáciles de probar y mantener.

Si está buscando usar MVVM en una aplicación web que NO es Silverlight, busque en ASP.NET MVC . MVVM también es una opción si está usando Silverlight. Incluso puede mezclar los dos, hospedando su aplicación Silverlight en un sitio web de MVC.

Answer 3

MVVM es totalmente aceptable para el desarrollo web. De hecho, se recomienda para el desarrollo de Silverlight. Nuestra empresa utiliza MVVM + Silverlight para muchos de nuestros proyectos con gran éxito. La curva de aprendizaje inicial puede ser difícil, pero una vez que hace clic, ofrece muchos beneficios.

En mi opinión, para que MVVM realmente funcione, necesita un marco que tenga soporte de encuadernación correcto. De lo contrario, tendrás que escribir una gran cantidad de código "pegamento" para unir tu vista y ver el modelo. Silverlight tiene un excelente soporte de enlace y si se hace correctamente, puede eliminar la mayor parte del código subyacente en su vista, de modo que toda la lógica de su negocio permanezca en su ViewModel.

Tim Heuer tiene excelentes tutoriales y videos en MVVM con Silverlight. Recomiendo revisar sus cosas. http://timheuer.com/blog/articles/getting-started-with-silverlight-development.aspx

Answer 4

Para el desarrollo web prefiero ir a MVC. Si es puramente Silveright entonces MVVM se puede considerar

Answer 5

Para web web (html) no es realmente utilizable, ya que el punto mvvm es tener una interfaz que refleje los cambios en el modelo de vista inmediatamente. (a través de enlace de datos / eventos).

Para la web, un cambio en el modelo de vista suele ser una reconstrucción posterior a la publicación completa de la pantalla.
Entonces, para qué molestarse..

Sin embargo, si tiene un sitio web AJAX con una página HTML fija, si el contenido se actualiza continuamente con javascript. Entonces se vuelve interesante.

Answer 6

MVVM es totalmente aceptable con WPF y también con Silverlight. Si desea usar MVVM para desarrollo web, tendrá que escribir una gran cantidad de código jscript. Hay un ejemplo en MSDN sobre cómo hacer esto:

Consulte el siguiente enlace: http://msdn.microsoft.com/en-us/scriptjunkie/hh297451

Answer 7

Por supuesto, MVVM es un patrón válido de "web", pero actualmente tiene usos muy limitados.

La principal diferencia entre MVC y MVVM es la actualización de los datos de su aplicación. Para las aplicaciones web actuales, se prefiere MVC porque la web es principalmente una comunicación unidireccional y toda la entrada del usuario se encapsula con formularios.

MVVM se vuelve útil al crear aplicaciones realmente interactivas con una interfaz de usuario rica.

Entonces para hacerlo simple. Si está creando una solución web con ASP.NET (o cualquier otra tecnología orientada al servidor) entonces use MVC. Si está haciendo una aplicación de interfaz de usuario enriquecida, use MVVM y, si no le gusta Silverlight, pruebe la solución de KnockoutJS para Javascript.

Answer 8

MVVM puede funcionar bien en la Web y en tecnología basada en XAML. La tecnología XAML tiene una ventaja en sus asombrosas funciones de vinculación que se preparan. Pero con las bibliotecas de JavaScript como Knockout (que es excelente) y JsViews / JsRender (que debe considerar una vez que JsViews pase a ser beta).

Para responderte específicamente: sí, puedes hacer MVVM con aplicaciones web. ¿Esta bien? Sí, si usa una biblioteca como Knockout (http://knockoutjs.com). Las claves para MVVM radican en que es un patrón de separación simple que:

1. separa la vista (la página)
2. separa el modelo (los datos brutos)
3. separa el modelo de vista (lógica de presentación)

En ninguna parte está la tecnología prescrita por MVVM. La vista es tu html, tu estructura. El modelo es tu información (tal vez JSON). El viewmodel es su objeto javascript que separa la lógica de su vista específica.

Knockout proporciona los medios para el enlace de datos durante el día a través de un concepto que llama observables. básicamente, piensa en esto como la interfaz INotifyPropertyChanged pero para JavaScript. Knockout también es compatible con observableArray (que es similar a ObservableCollection en XAML). Knockout tiene muchas otras funciones que te permiten suscribirte a eventos de cambio de datos, crear comportamientos, enlaces personalizados y mucho más. De todos modos ... con Knockout obtienes un poco.

Si eliges hacer MVVM sin una biblioteca como Knockout, aún puedes hacerlo, pero pierdes las funciones de enlace de datos y probablemente quieras escribir algo tú mismo. Pero le recomiendo que se quede con una biblioteca que hace esto por usted.

Larga respuesta ... pero quería darte lo suficiente como para comenzar a explorar.

Answer 9

Como se mencionó, Knockout.js es una fantástica biblioteca que proporciona muchas de las funciones necesarias para MVVM en la web. Creé un framework compuesto que es un framework MVVM mucho más completo. Tiene similitudes con Prism de Microsoft y está siendo utilizado en un producto bastante grande y complejo que apunta a plataformas web y móviles.

Échale un vistazo: http://danderson00.blogspot.com/2012/08/introducing-knockoutcomposite.html

Answer 10

Tengo una implementación de MVVM para la web usando varias tecnologías, Knockout, jQuery, Websockets y .NET. Vea el artículo aquí: http://salmanq.com/blog/using-the-mvvm-pattern-on-web-applications-part-i/2013/02/