crud00

TUTORIAL: CRUD con MVC y Entity Framework

Share Button

A continuación se explicará qué es el Modelo Vista Controlador (MVC), los beneficios y la manera de desarrollar un CRUD con MVC y ADO.NET Entity Framework paso a paso.

Introducción al Modelo Vista Controlador

El Modelo Vista Controlador (MVC) es un patrón de arquitectura de software que separa los datos y la lógica de negocio de una aplicación de la interfaz de usuario y el módulo encargado de gestionar los eventos y las comunicaciones.

Para ello MVC propone la construcción de tres componentes distintos que son el modelo, la vista y el controlador, es decir, por un lado define componentes para la representación de la información, y por otro lado para la interacción del usuario. Este patrón de diseño se basa en las ideas de reutilización de código y la separación de conceptos, características que buscan facilitar la tarea de desarrollo de aplicaciones y su posterior mantenimiento.

ADO.NET Entity Framework es un Framework ORM para la plataforma .NET.

Ya que sabemos los conceptos básicos podremos ver los beneficios de usar estas tecnologías.

Comenzando con la base de datos

Bien empecemos, lo primero será realizar una base de datos, para eso podremos hacerla en SQL Server desde el mismo Visual Studio o cualquier otro manejador, en este caso usaremos SQL.

Abrimos Visual Studio, hacemos clic en Ver -> Explorador de Servidores, en la pestaña damos clic derecho en Crear nueva base de datos SQL Server…

crud01

Procedemos a crear la base de datos local de Visual Studio; en este caso se utilizó un ejemplo pequeño de una escuela, esta base de datos contendrá 2 tablas una de alumnos y otra de carrera que se relacionarán.

crud02

Ya que se haya creado, hacemos clic derecho en Tablas y en la opción Agregar nueva tabla.

crud03

La estructura de la base de datos será la siguiente:

Nombre del campo
Tipo
Id_Alumno
Int
Nombre
Varchar
Apellido_Paterno
Varchar
Apellido_Materno
Varchar
Grado
int
Id_Carrera
int

Tabla Alumnos

Tabla Carrera.

Nombre del campo
Tipo
Id_Carrera
Int
Nombre
Varchar

Entonces creamos nuestras tablas con sus Foreign Key.

crud06

Agregando el modelo con Entity Framework

Ahora sí empieza lo bueno…

Comenzamos por crear un nuevo proyecto. Si usas Visual Studio 2013 es en la plantilla Web -> Aplicación web ASP.NET.

crud07

Si usas Visual 2012 es en Aplicación web ASP.Net MVC 4

crud08

Seleccionamos la plantilla MVC si usas VS2013.

crud09

Y si usas VS2012, selecciona Aplicación de Internet.

crud10

Al crear nuestro proyecto podremos ver que nos crea la estructura y se aprecian las carpetas de Vista (Views), Modelo (Models) y Controlador (Controllers).

crud14

Ahora crearemos la capa de datos con Entity Framework, para esto hacemos clic derecho en la solución opción Agregar y seleccionamos Nuevo Proyecto.

crud12

Buscamos la plantilla Biblioteca de Clases, le asignamos un nombre y pulsamos Aceptar.

crud13

Ya creada nuestra biblioteca, el paso siguiente es agregar nuestro modelo con Entity Framework lo cual se hace de la siguiente manera:

crud14

crud15

crud16

crud17

crud18

Lo cual nos dará como resultado un modelo

crud19

Ya casi terminamos, el siguiente paso es agregar Entity a nuestro proyecto de MVC; para eso seleccionamos el proyecto de MVC, pulsamos clic derecho y seleccionamos Agregar y después Referencia.

crud20

crud21

El siguiente paso es copiar la línea connectioString de nuestra App.Config y remplazar esa misma sección en Web.Config del proyecto MVC.

crud22

crud23

Creando CRUD

Ahora sí, el momento de la verdad en que compilamos la solución. Es entonces el momento de crear nuestro CRUD, para eso damos clic derecho en la carpeta Controllers -> Agregar -> Agregar Controlador.

crud24

Al agregar nombramos nuestro controlador, seleccionamos la clase y el contexto.

crud25

Listo, ya tenemos nuestro CRUD hecho, ahora si ejecutamos nuestra aplicación no podremos acceder a ella porque no tenemos un link que nos enlace a las vistas que creamos, para solucionar esto solo necesitamos editar el _Layout.cshtm que es la plantilla padre, todas las páginas que creemos tendrán esa estructura. Solo agregamos un link hacia la vista.

crud26

Ejecutamos nuestra aplicación.

crud27

crud28

crud29

¡Y listo! Ya tenemos nuestra aplicación CRUD con MVC y Entity Framework, espero que este tutorial les haya servido, si tienen alguna duda pueden contactarme en los comentarios o a mi correo.

Acerca del Autor

Miguel Eduardo Quiroz Rumualdo es desarrollador en la plataforma Java y .Net. Se graduó de la Ingeniería en Sistemas Computacionales del ITCG de Zihuatanejo Gro. Actualmente se desempeña en Dawcons en el área de equipos extendidos. Contáctalo en su correo:
[email protected]

3 comentarios sobre “TUTORIAL: CRUD con MVC y Entity Framework”

  1. hola he seguido tu ejemplo para crear una pequeña aplicación, pero me resulta un error que es el siguiente “Se produjo una excepción de tipo ‘System.Data.Entity.Infrastructure.DbUpdateException’ en EntityFramework.dll pero no se controló en el código del usuario
    Información adicional: An error occurred while updating the entries. See the inner exception for details.”
    al momento de intentar crear un registro en tu ejemplo no me sucede este error
    Podrias indicarme la solución, Gracias

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>