Una sinfonía en C#

Un pequeño aporte a la comunidad de habla hispana.

ASP.NET MVC Series–El patrón MVC

ASP.NET MVC es una implementación del patrón de diseño MVC, el cual separa la aplicación en tres componente, el modelo la vista y el controlador.

Parte a parte

La vista es la representación de los datos, el ejemplo más claro en una aplicación web es el HTML de la pantalla, pero podría ser tranquilamente un JSON que expone una API.

El modelo es todo el dominio de la aplicación, con sus datos, su comportamiento y todo lo necesario para solucionar el problema de negocios, sin necesidad de ninguno de los otros dos componentes.

El controlador simplemente vincula la vista y el modelo, se encarga de recibir las peticiones del usuario (en una aplicación web serían las peticiones HTTP, por ejemplo cuando un usuario coloca una dirección URL o presiona un link, en el ejemplo de la API la invocación de un método de la misma) y retornar el resultado del modelo a la vista, de esto podemos sacar conclusiones importantes:

  • El modelo pude (y debería) funcionar sin la vista ni el controlador.
  • La vista no conoce el modelo, sino que recibe datos del controlador. (no siempre los datos que recibe una vista son objetos del modelo)
  • El modelo no recibe nunca una petición directa de la vista, todo llega a través del controlador.
  • El modelo representa todo el negocio.
  • Nunca debería existir lógica de negocios en el controlador.

Otras características

Gran extensiblidad

Vamos a ver que el framework está pensado de una manera en que todo se puede cambiar, si bien casi siempre los componentes que trae resuelven nuestro problema, para aquellos casos en que no sea así o queramos algo especial podemos hacerlo gracias a su capacidad de extensibilidad.

Convención sobre configuración

En general se busca minimizar la configuración necesaria y muchas del comportamiento se define por convención, por ejemplo: cuando se escribe la URL.

http://sitio.com/usuarios/list

ASP.NET MVC sabe que tiene que instanciar el controlador UsuariosController e invocar el método List, ya que así está definido por convención.

Hay muchas convenciones, las vamos a ir viendo a su tiempo, de todos modos casi siempre es posible modificar este comportamiento por defecto.

Motor de vistas

Una de las tres partes del patrón es la vista, existe una sintaxis especial programar en la vista (además del HTML) en el caso de ASP.NET MVC es posible cambiar el motor que interpreta lo que escribimos en la vista, por defecto tenemos dos, el mismo de Webforms que se llama ASP.NET y uno especialmente pensado para MVC que se llama Razor.

Motor de rutas

La forma de saber qué controlador será invocado cuando el usuario escriba una URL en el navegador es definida por el motor de ruteo, es muy flexible y permite hacer cosas muy interesantes que ayudan a la organización y a SEO

HTMLHelpers

Dentro de la vista no tenemos la posibilidad de usar controles como en Webforms pero podemos utilizar los llamados HTMLHelpers que son algo similar y permiten hacer cosas como generar el HTML de un combo (elemento select de HTML) a partir de un IEnumerable<T>, también podemos crear nuestros propios HTMLHelpers.

Action Filters

Las acciones del usuario llegan al controlador, esto lo sabemos, pero existe otro componente que recibe antes las invocaciones y también puede modificar las respuestas del controlador, se llaman intercepting filters según la definición del patrón MVC, en el caso de ASP.NET MVC se los llama Action Filters y permite hacer cosas como decorar un método del un controlador con una atributo y que esto impida que se llame al método sin tener una cookie dada ya que la llamada es recibida primero por el Action Filter, también podemos manipular la respuesta del controlador y agregarle un META TAG al HTML resultante o cualquier otra cosa que necesitemos.

Model Binder

Este componente se encarga de recibir los datos enviados por el usuario (tanto por GET como por POST, etc.) y generar un objeto a partir de ellos, es decir, si un controlador espera que el usuario le envíe un objeto “Mensaje” el model binder va a intentar crear uno y llenarlo con los datos que se enviaron en el request HTTP, vamos a verlo en más detalle después pero es casi mágico.

Action Result

Cuando un controlador consulta al modelo y éste devuelve un resultado, está listo para mostrarlo al usuario, la respuesta del controlador siempre se basa en un ActionResult, que no es más que un tipo que representa una respuesta HTTP, todos los tipos de resultados (o casi) heredan de ActionResult, el más común es el ViewResult que retorna una representación HTML, pero hay otros como por ejemplo JSONResult que devuelve un JSON, de nuevo, vamos a verlo más en detalle después.

image

El modelo quedaría más o menos así (simplificado y levemente modificado para mejor compresión)

Hay más

Existen otros componentes y muchos detalles que vamos a ir viendo más adelante, de momento con esto podemos empezar a meter mano en el código.

Nos leemos.

ASP.NET MVC Series–Qué es ASP.NET MVC?

Comenzamos esta serie bien desde el principio, contestando algunas grandes preguntas:

  • Qué es ASP.NET MVC y para qué sirve?
  • Es lo mismo que ASP?
  • Es lo mismo que ASP.NET?
  • Qué ventajas tengo si lo uso?
  • Qué desventajas tengo si lo uso?
  • A partir de ahora lo uso para todos los sitios web que voy a hacer?
  • Es gratis, open source, qué hace falta para usarlo?

Vamos a empezar a contestarlas de a una.

image

Qué es ASP.NET MVC?

ASP.NET MVC es un framework de desarrollo web desarrollado por Microsoft, está construido sobre ASP.NET y es una implementación del patrón Model View Controller, actualmente nos encontramos en la versión 4 de este producto.

Sirve para hacer aplicaciones Web de todo tipo y en su última versión permite hacer servicios REST de forma muy sencilla.

Es lo mismo que ASP?

No, ASP o ASP 3 o también conocido como ASP clásico es algo bien diferente y no tiene nada que ver con el mundo .net, si bien ASP.NET supone una evolución del otro.

Es lo mismo que ASP.NET?

No, en ASP.NET MVC no existen los webforms ni los componentes ni los eventos ni el viewstate como se conocen en ASP.NET, si bien está construido sobre ASP.NET y esto implica que tienen mucho en común la idea es bien distinta debido al patrón que utilizan.

Qué ventajas tengo si lo uso?

La principal ventaja es la utilización del patrón MVC que permite organizar la aplicación de un modo más claro, donde cada parte tiene su responsabilidad, esto permite además, utilizar pruebas unitarias sobre el modelo si aplicamos bien el patrón, y también trabajar casi sin pensar en la presentación, vuelvo a aclarar, siempre que se utilice bien el patrón.

Además tenemos total control de lo que ocurre, a diferencia de ASP.NET webforms en donde muchas cosas están fuera de nuestro control.

Por último es extremadamente extensible, lo que no hace el framework tal cual se ofrece podemos hacerlo con algún componente externo o hacerlo nosotros, esto incluye el manejo de rutas, los filtros, tipos de resultados, etc.

Qué desventajas tengo si lo uso?

La principal desventaja es que es más complejo lograr cosas que con ASP.NET con webforms son muy sencillas como por ejemplo conectar a una base de datos y mostrar en una grilla, la otra desventaja es que es necesario un mayor conocimiento de HTTP para lograr aprovechar el potencial de la herramienta.

A partir de ahora lo uso para todos los sitios web que voy a hacer?

Una gran pregunta, en mi opinión la respuesta es que no, sin embargo para la gran mayoría de las aplicaciones que vamos a hacer normalmente es lo más indicado, pero puede haber casos de armar un prototipo rápido o una herramienta para llenar datos en la que webforms o algo basado en componentes sería más rápido de implementar y más adecuado.

Es gratis, open source, qué hace falta para usarlo?

En principio es un framework construido sobre ASP.NET MVC que es open source, sin embargo hace falta .NET 2 o superior para correrlo (o Mono) por lo tanto es necesario por lo menos IIS 6 (se puede hacer funcionar MVC 1 en IIS 5 con un poco de configuración)

Si queremos utilizar el patrón MVC en .NET 1.1 tenemos que utilizar alguna otra implementación como por ejemplo Monorail

Por último

Según mi experiencia hoy por hoy la forma de hacer una aplicación web con el stack .NET es con MVC, si bien ASP.NET webforms ha ido evolucionando sigue teniendo lo que para mí son grandes contras, la cantidad de HTML que genera de más, problemas de compatibilidad con browsers de algunos componentes y la falta de control sobre el comportamiento de algunas cosas (el ciclo de vida de ciertos componentes no es igual que el del webforms, etc) ASP.NET MVC permite ir a una arquitectura más clara y escalable (no digo que no se pueda con ASP.NET webforms pero hay que poner mucho del lado de uno ya que el framework no está pensado así) y utilizar prácticas más profesionales como test unitarios en prácticamente todas las partes de la aplicación.

Además ASP.NET MVC es muy extensible y podemos controlar prácticamente todo el comportamiento, mi consejo es usarlo siempre que sea posible.

Hasta la próxima.

ASP.NET MVC Series-Empezando desde cero

Nota: ya escribí antes sobre ASP.NET MVC y no es un tema nuevo, el objetivo de esta serie de post es ayudar a la gente que no se ha introducido todavía en el tema.´

Presentación

Este post es el primero de una serie que pienso llevar adelante sobre ASP.NET MVC, la idea es cubrir la mayor parte de temas empezando bien desde cero para que quienes no conocen la tecnología, o escucharon y nunca se metieron en tema, o lo usan pero hay muchas cosas que no son claras, puedan tener mejores herramientas para abordar el desarrollo de aplicaciones web.

Qué vamos a cubrir

Con respecto a ASP.NET MVC, vamos a hablar sobre la herramientas, sobre el patrón de diseño, las ventajas, también sobre las versiones, diferentes motores de vista, pero no dejaremos de lado cosas importantes como librerías populares como jQuery, Modernizr.js, y por supuesto las técnicas asociadas a una aplicación web moderna, como CSS 3, HTML5, AJAX, CDN, etc.

Tal vez algunas cosas sean redundantes con otros post, pero la idea es poder seguir un aparente order Guiño

Invitación

Entonces, estaré iniciando los post sobre ASP.NET MVC esta misma semana, así que manténganse atentos, si quieren que se toque algún tema en particular no tienen más que enviarme un mail, un tweet un DM o utilizar el formulario de contacto del blog.

Nos leemos.

Cómo devolver imágenes en ASP.NET MVC, o qué es un ActionResult?

En general cuando trabajamos con ASP.NET MVC la mayor parte de las veces nuestros Controllers devuelve un tipo derivado de ActionResult usando un método de la clase base Controller, por ejemplo así:

[HandleError]
public class HomeController : Controller
{
    public ActionResult Index()
    {
        ViewData["Message"] = "Welcome to ASP.NET MVC!";

        return View();
    }
}

En este caso estamos devolviendo una vista, es decir, un HTML.

Todo es HTTP

En definitiva, todo lo que retorna un Controller es una respuesta HTTP, los ActionResult no son más que representaciones de diferentes tipos de respuestas HTTP, que en principio son casi iguales (remarco el casi) pero ASP.NET MVC modifica el header Content-type de la respuesta para que el navegador la interprete de una u otra forma, en el caso de una Vista pasa esto (con Fiddler):

image

 

Como se ve en la imagen el header Content-type indica que la respuesta tiene que ser interpretada como text/html, es decir un HTML.

Qué pasa si retornamos un Redirect?

Entre los métodos de la case base Controller tenemos uno que se llama Redirect, que no hace más que retornar una respuesta HTTP con el status code que indica al navegador que debe redireccionar y además agrega la URL de destino

public ActionResult Index()
{
    return base.Redirect("http://www.bing.com");
}

image

En el caso que devolvamos el método Script tenemos un status code 200 y el Content-type correspondiente a un Script

public ActionResult Index()
{
    return base.JavaScript("alert('este código javascript 
es devuelto por el controller')");
}

image

Entonces, cómo devolvemos una imagen desde ASP.NET MVC?

Entonces para devolver una imagen desde un Controller tenemos que escribir su contenido (el Stream de la imagen) en el cuerpo de la respuesta y el Content-type adecuado para el tipo de imagen, por ejemplo image/png

public ActionResult Index()
{
    var content = System.IO.File.ReadAllBytes(Server.MapPath("~/images/facebook.png"));
    return base.File(content, "image/png");
}

image

Y listo!

image

Nos leemos!

101 Javascript Samples, nuevo Open Source de Kinetica

Junto con Matías Iácono y Fernando Claverino estábamos pensando en alguna manera de compartir la experiencia con Javascript con nuestros compañeros de Kinetica y, por qué no, con el mundo.

Un proyecto, muchos colaboradores

Entonces se nos ocurrió generar una base de conocimientos para todo el mundo en un repositorio de acceso público, que abarque lo que nosotros sabemos y lo que todos puedan aporta con pequeños ejemplos, de a poco, pero tratando de cubrirlo todo.

101 Javascripts samples en Github

Es por eso que empezamos esta semana a reunirnos en grupos y abordar diferentes temas de Javascript como:

  • Creación de objetos
  • TDD
  • Modularización

Y de esta manera comenzar a generar el material, pero más que nada, generar conocimiento colectivo de todos y para todos, estos temas son los iniciales, vamos a tratar de tocar todos.

Invitación

De momento quien quiera puede abrir un fork o hacer pull request, el repositorio está en

https://github.com/leomicheloni/101-javascript-samples

Más adelante iremos pensando cómo integrar a más gente y cómo ir haciendo de esto algo bien útil para todos.

Nos leemos.