EF Code First y Data Scaffolding con ASP.NET MVC 3 Tools Update

Hace poco blogueé sobre las nuevas ASP.NET MVC 3 Tools Update que publicamos el mes pasado.

En el post de hoy voy a hacer una introducción más detallada a dos de las nuevas características que trae:

  1. Soporte integrado de EF 4.1 (que incluye el nuevo soporte EF "CodeFirst")
  2. Soporte para data Scaffolding integrado en Visual Studio (que nos permite crear sitios guiados por datos rápidamente)

Estas dos características una forma muy poderosa de trabajar con datos y crear aplicaciones web guiadas por datos.

Escenario que crearemos

Para ayudar a ilustrar cómo usaremos las características anteriores, veremos la creación de un sitio simple guiado por datos. Soportará el listado de productos:

También soportará la creación/edición de productos (y categorías):

Ahora podemos crear esta a plicación (y crearemos la base de datos que tendrá detrás) con ASP.NET MVC3 en tan sólo uno o dos minutos.

Paso 1: Crear un nuevo proyecto

Comenzamos creando un nuevo proyecto ASP.NET MVC 3 (desde el menú File/New Project). Usaremos la plantilla "Internet Project" - que nos ofrecerá una plantilla por defecto para nuestra aplicación.

Cuando veamos el proyecto en el explorador de soluciones, veremos que ASP.NET MVC3 Tools Update a añadido un nuevo assembly - EntityFramework-  a nuestros proyectos ASP.NET MVC 3:

El assembly EntityFramework implementa Entity Framework 4.1 - que también publicamos el mes pasado. EF 4.1 viene con un montón de mejoras en la API de datos de .NET - incluyendo la opción "code first". EF Code First nos ofrece una forma elegante y limpia de trabajar con datos, y nos permite hacerlo sin requerir ningún archivo XML de mapeo. Podemos aprovechar fácilmente sus ventajas por defecto con todos los nuevos proyectos ASP.NET MVC3.

Usaremos la aproximación EF Code First para implementar el acceso a datos de nuestra aplicación:

Paso 2: Implementar el modelo de clases

El primer paso será crear dos clases - Product y Category- que usaremos para definir el "modelo" de nuestra aplicación. Los implementaremos como "plain old C# objects" (POCO) en el directorio Models de nuestro proyecto con el siguiente código:

Fijáos cómo las clases anteriores son clases normales con tipos de datos estándar de .NET. No necesitan heredar de ninguna clase base, ni implementar ninguna interfaz.

Además de las propiedades escalares, cada clase tieneuna propiedad de "asociación". Por ejemplo, la clase "Product"  tiene una propiedad "Category" que permite al desarrollador tener acceso a la categoría a la que pertenece. Del mismo modo, la clase "Category" tiene una propiedad "Products" que permite al desarrollador obtener los Productos de una Categoría particular. EF Code First sabe trabajar automáticamente con estas asociacioens (usando los valores de clave primaria y foránea), y puede hacer una carga lazy del datoa apropiado bajo demanda.

Paso 3: Implementar una clase StoreContext usando EF Code First

Ahora que hemos definido nuestras dos clases del modelo, nuestro siguiente paso es implementar una clase "DbContext" usando EF Code First que mapeará el modelo de clases a tablas en una base de datos. La implementaremos con el siguiente código:

La clase "StoreContext" anterior es la clase DbContext que usaremos para mapear las clases Product y Category a la base de datos. Hereda de DbContext ofrecida por EF Code First y expone dos propiedades que se corresponden a tablas de nuestra base de datos. Para este ejemplo estamos usando las reglas por defecto "convention over configuration" para definir cómo deberían mapearse las clases en la base de datos. Es decir, que la propiedad Products se mapeará a una tabla Products, y la propiedad Categories se mapeará a la tabla Categories. En próximos post hablaré sobre cómo podemos sobreescribir esto y realizar mapeos personalizados.

Podemos añadir las clases anteriores en cualquier sitio de nuestra solución. Por ejemplo, podemos añadirlo al directorio Models de nuestro proyecto - o en un proyecto de librería si preferimos mantener el código de datos separado. Tendremos que añadir una sentencia "using" al namespace System.Data.Entity al principio del archivo de la calse (para poder referenciar a las clases DbContext y DbSet<T>).

Después de salvar los archivos anteriores, compilamos el proyecto - tendremos que compilar ántes del siguiente paso.

Paso 4: Construir un controlador de Categories

Tenemos todo lo que necesitamos para modelar nuestros datos y salvar/obtenerlos  de la base de datos. Ahora crearemos la clase controladora de ASP.NET MVC que implementará el soporte necesario para mostrar las Categorías y para crear/editar/borrar objetos Category. Ántes de ASP.NET MVC 3 Tools Update teníamos que escribir a mano la clase Controller para esto (e implementar todo el código de EF a mano). ASP.NET MVC 3 Tools Update incluye el soporte necesario para hacer eso de forma automática.

Para construir la clase controller de Categorías, hacemos clic derecho en el directorio Controllers de nuestro proyecto y seleccionamos la opción Add-> Controller:

Esto nos mostrará el diálogo "Add Controller". Llamaremos a la clase controladora que queremos crear "CategoriesController". A partir de ASP.NET MVC 3 Tools Update el diálogo Add Controller soporta una nueva sección "Scaffolding options" - que nos permite seleccionar la creación de un controlador usando un montón de plantillas integradas:

Elegiremos la plantilla "Controller with read/write actions and views, using Entity Framework" - que nos creará una clase controladora con todo el código EF necesario para crear, actualizar, listar y borrar objetos.

Después de seleccionar esta plantilla, podemos elegir qué clases del modelo queremos que nuestro controlador implemente el soporte CRUD - en este caso la clase Category. También podemos seleccionar la clase EF DbContext/ObjectContext que queremos usar para acceder a la base de datos - en este caso seleccionamos la clase "StoreContext" que definimos antes:

Cuando hacemos clic en el botón "Add", Visual Studio creará automáticamente la clase CategoriesController por nosotros - con los métodos acción necesarios de Create, Edit, Details, Delete e Index - así como las vistas asociadas a cada una de las accioens:

Si abrimos el archivo CategoriesController.cs veremos que los métodos de acción implementados por EF para el soporte CRUD

Y ahora tenemos todo el código necesario para implementar el listado y la edición de categorías de nuestra base de datos.

Paso 5: Configurar la base de datos

El último paso que aremos ántes de ejecutar nuestra aplicación es apuntar nuestra a aplicación a la base de datos que queremos usar. EF Code First nos permite usar una base de datos existente que ya tengamos definida, o podemos apuntar a una base de datos que no existea - en este último caso EF la creará por nosotros usando el modelo de clases que hemos definido.

Sin cadena de conexión

Por defecto, no necesitamos configurar una cadena de conexión para que apunte a una base de datos. Si no especificamos ninguna, EF Code First creara una nueva base de datos SQL Express cuyo nombre coincida con el nombre de nuestro DbContext (por ejemplo: creará una base de datos llamada ScaffoldingDemo.Models.StoreContext en la instancia local .SQLExpress).

Especificando la cadena de conexión

Podemos indicar explícitamente donde queremos tener nuestra base de datos añadiendo una cadena de conexión al web.config de nuestra aplicación. Nombraremos la cadena de conexión para que coincida con la clase DbContext. Por ejemplo - en nuestra aplicación anterior la clase DbContext la llamamos "StoreContext", y por defecto EF buscará una cadena de conexión con el mismo nombre para determinar la localización de la base de datos.

Aquí tenéis la entrada que añadiremos al web.config si queremos usar una base de datos embebida SQL CE llamada Store.sdf en el directorio App_data:

<configuration>
<connectionStrings>
<add name="StoreContext"
connectionString="Data Source=|DataDirectory|Store.sdf"
providerName="System.Data.SqlServerCe.4.0" />
</connectionStrings>

</configuration>

Podéis aprendder más sobre SQL CE - y las nuevas herramientas de VS 2010 SP1 - en mi post anterior sobre el tema.

Paso 6: Ejecutar la aplicación

Muy bien - ejectuemos la aplicación y navegemos a la url /Categories. Esto ejecutará el método Index() de la clase CategoriesController - que listará la lista de categorías de nuestra base de datos. Actualmente no tenemos ninguna:

Vamos a hacer clic en el enlace "Create New" para crear una nueva categoría - esto navegará a la url /Categories/Create, que nos ofrecerá un formulario para crear una nueva categoría:

Haciendo clic en el botón "Create" hará un post del formulario al controlador CategoriesController y añadirá una nueva categoría a nuestra base de datos. Podemos repetir esto unas cuantas veces para añadir varias categorías diferentes:

Lo increible es que no hemos tenido que escribir el código de ningún controlador ni vista para poder hacer esto - el soporte de creación genera automáticamente el código que necesitamos para permitirlo. Esto ofrece una forma muy sencilla de empezar. Podemos ahora modificar loq ue queremos para personalizar la funcionalidad como queramos.

Paso 7: Mirando la base de datos

Ántes configuramos la ap licación para que usase una cadena de conexión que apuntaba a una base de datos SQL CE que (en ese momento) no existía. Cuando ejecutamos la aplicación, EF 4.1 detectó esto y la creó automáticamente - basándose en las clases Product y Category que definimos ántes.

Para vere la base de datos, hacemos clic en "Show All Files" del explorador de soluciones y añadimos el archivo "Store.sdf" de base de datos que se EF creó para ese proyecto:

Una vez hecho esto podemos hacer doble clic en la base de datos para abrirla en el Explorador de Servidores - y expandir las tablas para ver el esquema que se ha creado:

Fijáos cómo EF Code First a creado el esquema apropiado basándose en las clases Category y Product que creamos ántes. También ha establecido automáticamente las relaciones de claves primarias y foráneas entre las dos tablas basándose en las asociaciones de las propiedades de las clases.

Paso 8: Creación de un controlador de Products

Hemos creado la clase CategoriesController para administrar el listado y la edición de categorías. Vamos a crear ahora la clase ProductsControllers para administrar el listado y la edición de Products.

Como en el caso anterior, hacemos clic derecho en el directorio Controllers de nuestro proyecto y seleccionamos el menú Add-> Controller. Llamaremos a la clase que queremos crear "ProductsController" e indicaremos que queremos crearlo usando la plantilla EF con la clase Product:

Hacemos clic en el botón "Add" y se creará la clase Products Controller, con los métodos CRUD necesarios y se crearán las vistas necesarias para ellos:

Podemos ejecutar el proyecto otra vez y navegamos a la URL /Products:

Cliquemos el enlace "Create New" para crear un nuevo producto:

Una cosa interesante es que el campo Cateogry es una lista desplegable de categorías válidas (y no sólo un textbox con una foreign-key para introducir un valor entero:

El soporte de creación de Visual Studio es lo suficientemente listo como para detectar que la Categoría es una asociación, y EF ofrece un desplegable con las categorías válidas.

Después de crear varios productos, la url /Products nos mostrará los datos introducidos:

Fijáos cómo se muestra la categoría usando un nombre amigable, y no sólo el valor de la clave foránea.

Aprendiendo más

Este pequeño tutorial nos ha mostrado un vistazo rápido a los nuevos soportes de scaffolding de EF Code First integrados en ASP.NET MVC 3 Tools Update, y nos muestra cómo podemos usarlo fácilmente para crear rápidamente una aplicación. EF Code First nos permite escribir un código de acceso a datos realmente limpio. El soporte de datos nos permite crear rápidamente la interfaz de usuario - que también podemos personalizar como queramos muy fácilmente.

Además de trabajar con EF Code First, también podemos usar el scaffolding contra objetos EF estándares (creados usando tanto la aproximación database-first o model-first y el diseñador WYSIWYG de EF.

Scaffolding

Podéis aprender más sobre el soporte de Scaffolding de ASP.NET MVC 3 en la charla que Steve Sanderson dió en el mix:

En su charla Steve también habla sobre cómo podemos usar el soporte de scaffolding desde la linea de comandos (usando Nuget) así como descargarla y usar las plantillas adicionales (por ejemplo: aquellas que pueden implementar automáticamente el patron repositorio, etc) También guardad en favoritos el blog de Steve sobre scaffolding (y su extensibilidad) aquí:

EF Code First

Postearé más sobre EF Code First en el futuro. Aquí tenéis algunos tutoriales que he escrito en el pasado sobre el tema:

Nota: Los tutoriales anteriores fueron escritos con la CTP4 de EFCode First (y algunas partes de la API son diferentes) - pero los conceptos y escenarios mostrados son losmismos que en la release final.

ASP.NET MVC 3

Si queréis aprender más sobre ASP.NET MVC 3 os recomiendo los videos de Scott Hanselman en los Dutch DevDays y los del MIX:

Mirad también los nuevos contenidos y videos del sitio http://asp.net/mvc:

Resúmen

El nuevo ASP.NET MVC 3 Tooling Update está llena de bendiciones. Si no la habéis descargado aún e instalado os lo recomiendo. Estad atentos, pronto habrán más pots.

Espero que sirva.

Scott.

Traducido por: Juan María Laó Ramos

Artículo original.

4 pensamientos en “EF Code First y Data Scaffolding con ASP.NET MVC 3 Tools Update

  1. Pingback: Mejoras de HTML5 con ASP.NET MVC 3 Tools Update « Thinking in .NET

  2. JulioAlfonso

    Excelente articulo, como hay pocos. En ingles se encuentran algunos pero obviamente cuesta mas.
    Sin embargo me gustaria saber si lo tienes en vb

    Responder
  3. Teddy

    Sabes que tengo problemas, ya que no me crea el drop solo.
    Tu me podrias decir como es el codigo HTML para poder darme cuenta como hacerlo ?

    Muchas gracias

    Responder
  4. jaime

    hola gracias por tu tutorial, mira tengo un problema, quiero encriptar la cadena de conexión en el config de la aplicación y cuando voy a conectarme con el EF desencriptarla, pero no se cómo hacer, me dijeron que con code firts se puede hacer pero no se, ¿me puede ayudar?

    gracias Dios le pague.

    esperando respuesta…

    Responder

Deja un comentario