Desarrollo y servicios web

Transcripción

1 Desarrollo y servicios web Luisa Fernanda Rincón Pérez

2 ASP.NET MVC 4

3 ASP.NET MVC ASP. NET MVC es un entorno de trabajo cuya primera versión surgió en el 2009 y busca facilitar el desarrollo siguiendo este patrón arquitectónico. Mejora la separación de conceptos en el desarrollo (Versión actual MVC 5 de Oct 2013)

4 Crear un nuevo proyecto MVC Abrir visual studio

5 En este caso seleccionamos Aplicación de internet

6 Estructura de directorios del nuevo proyecto Content: almacena el contenido estático de la aplicación. Controllers: almacena los controladores. Todos terminan con "Controller", como HomeController Models: almacena las clases que representan los modelos Scripts: aloja los ficheros javascript. Views: aloja las vistas.la carpeta Views contendrá tantas como controladores. Al generar una vista se crea una carpeta con el nombre del controlador (quitando la palabra "Controller", y a su vez dentro de ésta, se deben crea tantos ficheros como acciones disponga el Controlador. Dentro de la carpeta Views, la carpeta Shared sirve para alojar todo aquello que sea común para todos los controladores Ficheros especiales: Global.asax y Web.config.

7 Para ejecutar el proyecto creado seleccionar F5

8 Explorar el proyecto Cuáles son los controladores Cuál es la vista que se muestra cuándo se abre la aplicación En dónde se podría modificar el mensaje su logotipo aquí Las vistas corresponden a métodos de los controladores. Si, no? Dónde está el layout de toda las páginas

9 Controladores Son simples clases en C# (normalmente heredan de System.Web.Mvc.Controller). Cada método público dentro de un controlador es un action method (Metodos de Accion). Los métodos action method se pueden invocar desde Web por medio de una URL para ejecutar alguna acción.

10 Crear un nuevo controlador Click derecho sobre la carpeta controllers- >agregar ->controlador

11 Se crea un controlador con una única acción que en este caso es la de Index ActionResult. Es el objeto que retorna el controlador en este caso. El Action Result puede servir para retornar Vistas completas, redirecciones, vistas parciales, archivos.

12 Modificar método index para que retorne HolaMundo Servicios Web Ruta: El puerto no es fijo sino que cambiar para cada aplicación Volver a retornar la vista y el ActionResult

13 Rutas en ASP.NET Mapea las rutas en un archivo principal. El Modelo de dirección URL predeterminado es el siguiente {controller}/{action}/{id} No se requiere la extensión del archivo Si no se indica la acción del controlador, se carga su método por defecto (index). El archivo que tiene la configuración de las rutas por defecto es App_Start/RouteConfig.cs ( si la aplicación es C#) Modificar el archivo RouceConfig.cs para que se cargue por defecto el index del DemoController

14 Vistas Muestran la información del modelo cuando son invocadas por el controlador. Las vistas pueden tener un layout definido en la carpeta shared dentro de view. Las vistas pueden ser parciales si se desean incluir en otras vistas o si quiere obtener un comportamiento ajax

15 Adicionar Vista Regresar el código del Index para que retorne un ActionResult Falta adicionar la vista del controlador, se puede hacer dando click derecho sobre el método y seleccionando addview

16 Crear una nueva vista

17 Vistas Usar por defecto el layout definido en el archivo _viewstart.cshtml. En este archivo se define cuál es la vista maestra

18 Motor de vistas Razor Razor es el motor de vistas creado desde MVCC3 que sirve para usar código de VB o C# dentro de las páginas web. Es la evolución de ASPX. Las instrucciones se abren }.

19 Ejemplo de código Razor

20 var mivariable = valor; var mivariable1 = valor1; var mivariable2 = valor2; } Cada línea lleva ; al final Todos las variables que se muestren son parseadas con HTML Encode. Lo que hace es por seguridad remplazar símbolos <, > o & por sus correspondientes códigos.

21 Código HTML y Razor Este código genera un error porque no se sabe si la hora es es código razor o código c#. Para solucionarlo se

22 Pasar datos del controlador a la vista: ViewBag y ViewData ViewBag: Diccionario de datos dinámicos. Se le puede incluir lo que se quiera.

23

24 Helpers en ASP.NET ASP. NET ofrece dos tipos de Helpers para facilitar el desarrollo el código de la vistas: HTMLHelpers orientados a escribir código HTML. La mayoría de métodos que ofrecen son para trabajar con formularios. URLHelpers orientados a simplificar el trabajo con direcciones y conversiones de caracteres.

25 Modelo Sirve para pasar información entre el controlador y la vista y para representar la información del negocio Models agregar clase

26 Añadirle la propiedad ISBN, Titulo, Tipo libro (public y string)

27 Usar el modelo en el controlador

28 Incorporar el modelo en la vista Razor para el modelo: Si se requiere incluir un solo RutaModelo al principio de la vista. Si se requiere incluir más de un IEnumerable <RutaModelo> al principio de la vista.

29 @model RutaModelo al principio de la vista. Posteriormente en el mismo archivo (donde se encuentra la vista) se puede referenciar el atributo que se desee (en este caso va en mayúscula la letra M (en minúsculas la letra m ) es una palabra reservada en vistas (views) que utilizan Razor. Declara el tipo de dato que tiene el modelo y normalmente se pone al inicio de la vista (view). Usar el modelo dentro de código (campo)

30 Crear una biblioteca con una lista de libros Crear una nueva clase en el modelo llamada BibliotecaModel. Incorporar en la clase una Lista de la clase Libro. Adicionar un constructor en la clase con 3 tres libros.

31 Crear un controlador para el modelo BibliotecaModel En la carpeta controladores, clic derecho, agregar, controlador, seleccionar una plantilla como muestra la imagen.

32 Modificar el controlador Dado que la idea es manejar objetos de la clase BibiotecaController. Se debe adicionar un objeto estático de este tipo en el controlador BibliotecaController

33 Incorporar implementación para el método index Esta implementación retorna la lista de todos los objetos libros del objeto mibiblioteca

34 Incorporar vista para acción index Ubicado el curso en el método index del controlador dar clic derecho, agregar vista. En la ventana seleccionar Crear una vista fuertemente tipada y seleccionar la clase Libro, porque la idea es mostrar todos los libros de la biblioteca. Seleccionar la plantilla List dentro de Plantilla para Scaffold Si no aparece el modelo es porque primero se debe compilar el proyecto ( F6)

35 Index- vista

36 Adicionar lógica en la acción create Abrir BibliotecaController e incoporar en la acción create el código para adicionar un libro. Incorporar esto en el create que tiene la anotación HttpPost 1. Crear en el controlador un método que reciba por parámetro el tipo y nombre del libro y lo adicione a la lista de libros

37 Código para crear un libro

38 Clic derecho sobre la acción create del controlador, seleccionar adicionar vista. Seleccionar una vista fuertemente tipada, la clase del modelo libro y en la plantilla Create Incorporar la vista

39 La vista adicionada es la siguiente

40 Resultado al adicionar los valores

41 Adicionar la lógica para eliminar y editar libros

42 Validaciones Las validaciones se especifican en el modelo con Data Annotations tales como Required, String Length, Range, RegularExpression

43 Resultado de la validación

44 Personalizar mensajes de error Incluir en la anotación de validación el atributo ErrorMessage con el texto del mensaje.

45 Nombre de los campos en el formulario Se puede modificar el texto que se muestra en el formulario adicionando la anotación Display con el texto adecuado antes de cada campo

46 Tipos de campos ASP.NET MVC dispone un atributo para indicar el formato del campo DataType. Algunos tipos son: URL, Address, PhoneNumber, Currency, Password,Date

47

48 Modelo de Datos (Data Model) Los objetos de una clase modelo representan clases que están interactuando con la base de datos. Herramienta Entity Framework (EF). Enfoques: database-firstapproach (se crea primero la base de datos y después se general las clases) code-first-approach (se crean primero la clases y después la base de datos). lder-versions/hands-on-labs/aspnetmvc-4-models-and-data-access

49 CODE FIRST MVC está apuntando al modelo de trabajo Code First. Este modelo busca que primero se creen las clases con las restricciones del modelo y luego el framework se encarga de modelarlo en la base de datos.

50 Code First- Entity Framework El Entity Framework (EF) es un ORM que permite a los desarrolladores de.net trabajar con datos relacionales usando objetos específicos del dominio. Elimina la necesidad de la mayor parte del código de acceso a datos que los desarrolladores suelen tener que escribir.

51 Configurar ahora los libros y la biblioteca para trabar con bd Crear una base de datos llamada Biblioteca.mdf. Dentro de la carpeta app_data hacer clic derecho, agregar Base de datos de SQL server

52 Configurar la cadena de conexión Adicionar la siguiente línea en el archivo Web.config <add name="bibliotecacontext" connectionstring="data Source=(LocalDb)\v11.0; Integrated Security=SSPI;AttachDBFilename= DataDirectory \Biblioteca.mdf" providername="system.data.sqlclient" />

53 Crear una nueva clase en el modelo llamada TipoLibro

54 Crear nueva clase llamada LibroConTipoLibro

55 Contexto. Relacionar el modelo con la base de datos DbContext: Será el objeto que agrupará todos los elementos de nuestro modelo conceptual y manejará el mapeo de cada uno ellos con su par en la base de datos DbSet: Comúnmente usado como tipo de propiedades al interior de una clase que hereda del tipo DbContext, este recibe un tipo genérico el cual representa una entidad de nuestro dominio, de esta forma habilita las operaciones CRUD para la entidad especificada. Cada elemento de la lista es un registro de una tabla de la bd.

56 Crear controlador para el modelo y el contexto creado

57 Probar la aplicación

58 Cargar datos por defecto en el contexto Incorporar en el Global.asax lo siguiente

59 Las otras opciones son

60 Resultado ( crear)

61 Listar

62 Bibliografía ork-iniciando-con-code-first.html