miércoles, agosto 29, 2012

Cómo crear un CRUD (mantenimiento) básico Web utilizando ASP.Net MVC y Entity Framework


En este post explicaré paso a paso cómo crear rápidamente un mantenimiento básico Web (sin añadir una línea de código) que puede servirnos de base para crear una aplicación Web completa.

1. En Visual Studio 2010 crear un nuevo proyecto de tipo ASP.NET MVC 4 Web Application. Cuando hagamos Aceptar se nos preguntará por la plantilla a utilizar. En nuestro caso elegiremos Internet Application y Razor.



2. A continuación vamos a crear el modelo de datos que consistirá en una entidad Team (equipo) y otra Player (jugador) relacionadas entre sí como 1 a N. Para ello añadiremos un nuevo elemento a la carpeta Models de nuestro proyecto (haciendo click con el botón derecho sobre dicha carpeta en el Explorador de Soluciones de Visual Studio).




Después de pulsar Agregar se nos preguntará si queremos partir desde una base de datos o desde un modelo vacío. Dependiendo de esta elección trabajaremos siguiendo el patrón Database first  o Model first. Para nuestro ejemplo, utilizaremos Model first, ya que carecemos de una base de datos previa (ir a esta entrada del blog para más información sobre estos patrones de diseño).

En el diseñador de Entity Framework, abriremos el menú contextual para agregar las nuevas entidades



 Completar las entidades con las propiedades pertinentes




Desde el diseñador abrir el menú contextual para Generar base de datos desde el modelo.  Esto genera un script de SQL para generar la base de datos a partir del modelo. Es necesario ejecutarlo (desde el propio diseñador del recién creado fichero .sql).

3. Añadir controlador y vistas: Sobre la carpeta Controllers abrir el menú contextual para crear un nuevo Controller. Si elegimos la segunda o la tercera opción de Template nos creará automáticamente unas vistas asociadas al controlador (si no aparece el Model class y Data context class), compilar el proyecto (Generar). La tercera además implementa paginación y ordenación mediante Ajax.
  
 
Y… ¡listo! Ya podemos probar la aplicación ejecutándola con F5. Para ver la página correspondiente al mantenimiento que acabamos de crear podemos añadir a la url /Team (lógicamente en nuestra aplicación final lo que tendremos que hacer es crear un link).

No hay comentarios:

Publicar un comentario