Aprenda Workbook: Programación en ASP.NET usando Visual Studio 2010
Por: Felipe Ramírez Capítulos promocionales. El contenido de este documento está sujeto a cambios sin previo aviso. Las organizaciones, productos, personas, o eventos referidos en los ejemplos son ficticios, por lo cual no debe establecerse relación alguna, inferirse o atribuirse dicha relación, respecto a organizaciones, productos, personas, o eventos de la realidad. El contenido del presente material tiene protegidos los derechos de autor de la manera más amplia posible, por lo cual queda estrictamente prohibida su reproducción parcial o total. Queda estrictamente prohibido su almacenamiento o introducción a cualquier sistema de recuperación de datos. Queda estrictamente prohibida su reproducción o transmisión en cualquier medio conocido o por conocer, sin importar el propósito. La reproducción sólo podrá realizarse previa autorización por escrito del titular de los derechos. De acuerdo a lo establecido por la Ley Federal del Derecho de Autor, se someterá a proceso a aquél que PRODUZCA, REPRODUZCA, ALMACENE, DISTRIBUYA, TRANSPORTE O COMERCIALICE COPIAS DE LA OBRA SIN LA AUTORIZACIÓN DEL TITULAR DE LOS DERECHOS. Los nombres de organizaciones y productos comerciales que aparecen en el presente material son propiedad de sus respectivos dueños y titulares de derechos. © DERECHOS RESERVADOS POR LOS RESPECTIVOS TITULARES Aprenda Practicando http://www.Aprenda.mx
Unidad de aprendizaje 1
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
CONTENIDO ¿Por qué son populares las aplicaciones Web? ............................................................................................ 3 fundamentos de las aplicaciones Web .......................................................................................................... 3 Trabajo cliente - servidor........................................................................................................................... 3 Comunicación basada en TCP/IP ............................................................................................................... 4 Protocolo HTTP .......................................................................................................................................... 5 Modelos de aplicaciones Web....................................................................................................................... 5 Modelo de petición - respuesta ................................................................................................................ 5 Modelo de petición – respuesta dinámica ................................................................................................ 6 Modelo de petición – respuesta dinámica orientada a eventos ............................................................... 6 Plataforma Microsoft.NET ............................................................................................................................. 7 Principales capas de .NET .......................................................................................................................... 8 Aportaciones de .NET ................................................................................................................................ 9 Procesamiento de páginas Web en .NET....................................................................................................... 9 Características de ASP.NET .......................................................................................................................... 10 Requerimientos para el desarrollo de ASP.NET .......................................................................................... 11 Requerimientos del lado del cliente........................................................................................................ 11 Requerimientos del lado del servidor ..................................................................................................... 12 Lab.02.01: Creando un Web Site en Visual Studio 2010 ..................................................................... 12 Abriendo Visual Web Developer 2010 Express Edition. ...................................................................... 12 Creando un sitio web en Visual Studio. ............................................................................................... 14 Eliminando archivos usando Visual Studio. ......................................................................................... 17 Archivos generados. ............................................................................................................................ 18 Lab.02.02: Presentación ejecutiva ...................................................................................................... 18 Examen rápido del capítulo ......................................................................................................................... 20
2
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
¿POR QUÉ SON POPULARES LAS APLICACIONES WEB? Es innegable el beneficio que ha traído a la vida moderna el uso de Internet. Sin embargo, si tuviéramos que reconocer cuáles son las razones por las cuales las plataformas Web son tan importantes hoy en día, podemos enumerar las siguientes. 1.
Uso de Internet como red privada corporativa. A medida que los negocios se globalizan, la Internet cobra importancia como red privada corporativa; las organizaciones pueden mantener conectividad prácticamente en todo el mundo, sin tener que invertir en la instalación de infraestructura de telecomunicaciones, salvo casos especiales.
2.
Evolución en la confiabilidad de la Web. Desde 2003, las tecnologías relacionadas con la Web se han vuelto bastante estables, y su crecimiento, predecible. De esa manera, las empresas tienen más confianza en realizar inversiones en tecnologías Web, con algo de conocimiento relacionado al retorno de su inversión. Se puede trabajar con otro tipo de tecnologías, en lugar de desarrollos Web, sin embargo, el hecho de que las aplicaciones Web trabajen sobre protocolos estándar (TCP/IP, HTTP), hace que su comportamiento sea muy confiable.
3.
Posibilidad de desarrollo profesional. El ambiente Web domina el mercado de las aplicaciones que brindan servicios, y eso abre un campo inmenso para los servicios de desarrollo de aplicaciones basadas en la Web. Difícilmente un buen desarrollador Web tendrá problemas para conseguir trabajo.
4.
Plataformas de desarrollo estandarizadas y disponibles. La masificación del uso de lenguajes que permiten la programación Web (PHP, ASP, .NET, Java) permiten que los desarrolladores dispongan de recursos estandarizados para producir aplicaciones. Además, la gran difusión de estos lenguajes permite la disponibilidad de recursos y herramientas que facilitan las labores de desarrollo y administración, disponibilidad de expertos, etcétera. Cuando una empresa opta por un desarrollo Web, sabe que encontrará en el mercado recursos calificados que desarrollen aplicaciones y brinden soporte de calidad.
FUNDAMENTOS DE LAS APLICACIONES
WEB
Sabemos que una red es un conjunto de computadoras interconectadas entre sí para la transmisión de paquetes de datos, utilizando para ello protocolos de comunicación reconocidos. Las aplicaciones Web suponen que se está trabajando en un ambiente de red. Siempre se tiene un cliente, es decir, un equipo que lee los contenidos Web y los muestra; es en el cliente donde se lleva a cabo la interacción con el usuario. Se tiene también un servidor, que es el equipo donde se realiza el procesamiento de carácter centralizado y donde se encuentra el motor de ejecución Web que atenderá las peticiones de los clientes. El servidor ha venido evolucionando en funciones cada vez más complejas, es decir, ahora tiende a operar también como servidor de bases de datos, repositorio de archivos, y otros servicios. Para trabajar en ambiente Web, el cliente deberá contar con un navegador. El navegador es un programa interprete de contenidos Web, que se encarga de interpretar los lenguajes de hipertexto y de ejecutar los bloques de código soportados del lado del cliente.
www.Aprenda.mx – Knowledge Providers
3
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
Por su parte, el servidor deberá contar con un motor de ejecución Web, conocido también como Web Egine, que es el componente del servidor que se encarga de recibir las peticiones del cliente y de responderlas. El motor de ejecución Web se encarga del envío de información en hipertexto al cliente; también se encarga de la resolución de código del lado del servidor, así como de la interacción de la aplicación Web con otros componentes del servidor, como pueden ser librerías, motores de bases de datos, servicios, etcétera. Una de las grandes ventajas del desarrollo web respecto a otros modelos (como podrían ser las aplicaciones Windows), es que los desarrollos y los recursos fuertes se encuentran en el servidor, quien es el que se encarga de realizar la mayoría del trabajo; en otras plataformas, es necesario instalar componentes en cada una de las máquinas que utilizarán las aplicaciones, lo que es complicado cuando los clientes poseen máquinas de diferente arquitectura. Es posible que en tiempo de desarrollo usted codifique y pruebe sus aplicaciones en un mismo equipo; aun en ese caso dispondrá de un cliente y un servidor, ya que su equipo de desarrollo jugará los dos roles. El diálogo entre cliente y servidor, como ya se anotaba, se realiza a través de la intervención de los protocolos para el intercambio de paquetes de datos. Los protocolos son los convencionalismos de codificación e intercambio de datos, que garantizan el envío completo y correcto de los paquetes de datos a través de una red. Las aplicaciones Web utilizan diferentes protocolos para el manejo de datos. Dos son los más importantes para nuestros propósitos de desarrollo: TCP/IP y HTTP.
La Internet maneja como protocolo estándar el TCP/IP (Transfer Control Protocol / Internet Protocol). TCP/IP es un protocolo que permite identificar y ubicar los diferentes equipos que conforman una red; la identificación se lleva a cabo mediante una dirección llamada dirección IP, que consiste en 4 números separados por puntos, que se organizan dentro de segmentos. En sí, una dirección IP es la equivalencia lógica de la dirección física de la tarjeta de red de un equipo, llamada también NIC (Network Interface Card); como sabemos, la dirección física de una tarjeta de red es única en el mundo; la dirección IP simplemente hace más fácil la identificación. En resumen, TCP/IP nos permitirá llegar de un equipo a otro. Todavía hay un grado adicional de abstracción: los nombres de dominio. Los sistemas de nombres de dominio son aquellos que permiten registrar una equivalencia textual a una dirección IP. Estos se pueden contratar con organismos internacionales, que verifican la no duplicidad de nombres. La secuencia de equivalencias puede ser la siguiente. El identificador físico de la NIC
:
Puede tener su equivalente en dirección IP:
68768626787F768BA7687687A3321CC 207.142.231.135
Que a su vez puede tener un nombre de dominio equivalente: www.wikipedia.com
4
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
TCP/IP nos sirve para encontrar un equipo en la red, pero no es lo más adecuado para el trasporte de datos. En el caso de las páginas Web, los contenidos están expresados en lenguajes de marcas e hipertexto (HTML, XML, etc.); para transmitir ese tipo de contenidos de un lugar a otro de una manera eficiente, el protocolo ideal es el HTTP (Hyper Text Transfer Protocol). HTTP es un protocolo que permite hacer peticiones a un servidor Web, y transmitir de manera confiable y gradual los contenidos de hipertexto. HTTP tiene algunas derivaciones interesantes, por ejemplo HTTPS, que es el protocolo HTTP cifrado, utilizado para la transmisión segura de datos en las páginas Web.
MODELOS DE APLICACIONES WEB Los modelos de aplicaciones Web son aquellos esquemas tecnológicos que permiten utilizar la infraestructura de comunicaciones de Internet para el procesamiento de datos y para la gestión de bases de datos. La diferencia entre los modelos de aplicaciones Web se presenta en el tipo de trabajo colaborativo que realizan el cliente y el servidor.
El modelo de petición - respuesta es clásico en el ambiente cliente servidor; su simplicidad es abrumadora: el equipo cliente pide, el servidor responde. El modelo de petición - respuesta es aquel en donde los clientes realizan peticiones de lectura de contenidos Web y el servidor responde, enviando los archivos solicitados. Las páginas que trabajan bajo este modelo son las de extensión HTML (Hyper Text Markup Language), que pueden contener etiquetas HTML (que el navegador puede interpretar) y bloques de código del lado del cliente (bloques de código que el navegador puede interpretar y ejecutar). En este modelo el cliente actúa como solicitante de contenidos Web y como interprete de páginas Web. Por otra parte, el servidor actúa simplemente como servidor de archivos, ya que sólo se encarga de proporcionar los archivos que le piden. Este modelo es útil si nuestros sitios Web no requieren procesamiento alguno por parte del servidor, pues sus páginas son informativas y estáticas. Algunos afirman que las páginas HTML no son tan estáticas como parecen, ya que pueden contener bloques de código en VBScript y JavaScript, con lo cual se logran efectos divertidos que animan las páginas; sin embargo, el rol del servidor es pasivo, ya que éste código es interpretado por el navegador, y no por el servidor.
www.Aprenda.mx – Knowledge Providers
5
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
Aunque la lectura de contenidos Web es una herramienta excelente para la divulgación de información, su uso en los negocios no es muy útil. Lo que realmente se necesita es tener acceso a datos y procesamiento centralizado; en otras palabras, se requiere que el servidor tome parte activa en el procesamiento. El modelo de petición - respuesta dinámica es aquel en donde los clientes realizan peticiones de lectura de páginas Web que contienen bloques de código que deberán ser resueltos por el servidor, quien ejecutará el código y generará como respuesta etiquetas HTML. El código se llama código posicional, dado que se ejecuta en el lugar en el que es colocado en la página. Las páginas que trabajan bajo este modelo son las de extensión ASP (Active Server Pages) y las PHP , que pueden contener etiquetas HTML (que el navegador puede interpretar), bloques de código del lado del cliente (bloques de código que el navegador puede interpretar y ejecutar), definición de objetos registrados en el servidor, y bloques de código del lado del servidor (que sólo el servidor puede resolver). En este modelo el cliente actúa como solicitante de contenidos Web y como intérprete de páginas Web. Por su parte, el servidor actúa como servidor de archivos y como motor de ejecución, resolviendo los bloques de código ASP, convirtiéndolos en una respuesta HTML que el navegador pueda interpretar. Una de las limitantes de este modelo es que el usuario deberá realizar una petición de manera explícita cada vez que se requiera alguna intervención del servidor. Las páginas no son lo suficientemente inteligentes como para ahorrarnos el trabajo respecto a las tareas que son obvias.
Las páginas ASP son una maravilla, pero son rudimentarias por estar basadas en un esquema de petición respuesta muy estricto. Los usuarios de aplicaciones Windows, acostumbrados a la interactividad sin demoras con la aplicación, sienten que es muy engorroso estar realizando peticiones continuamente. Y tienen razón ya que están acostumbrados al enfoque orientado a eventos que brindan las aplicaciones Windows, en donde la aplicación responde a lo que el usuario está haciendo y a la forma en que interactúa con la aplicación. En otras palabras, la aplicación es lo suficientemente inteligente para adelantarse a nuestros movimientos, haciendo la tarea por nosotros, liberándonos de actividades que son obvias. El modelo de petición - respuesta dinámica orientada a eventos es aquel en donde los clientes realizan peticiones de lectura de páginas Web que contienen bloques de código que deberán ser resueltos por el servidor, quien ejecutará el código y generará como respuesta etiquetas HTML y bloques de código del lado del cliente en VBScript y JScript; estos procedimientos generados serán tan inteligentes que detectarán los eventos que el usuario provoca al interactuar con la aplicación del lado del cliente, realizando de manera automática peticiones al servidor sin que el usuario las solicite. Las páginas que trabajan bajo este modelo son las de extensión ASPX (Active Server Pages eXtended), que pueden contener etiquetas HTML (que el navegador puede interpretar), bloques de código del lado del cliente (bloques de código que el navegador puede interpretar y ejecutar), definición de objetos registrados en el servidor, y bloques de código del lado del servidor (que sólo el servidor puede resolver), y etiquetas de controles Web del servidor (que serán resueltos por el servidor). Es importante tomar en cuenta que estas páginas trabajan bajo la plataforma .NET, por lo que su modo de ejecución en el servidor varía respecto a la ejecución de las páginas ASP clásicas. En este modelo el cliente actúa como solicitante de contenidos Web, y como interprete de páginas Web. El servidor, por su parte, actúa como servidor de archivos, o como motor de ejecución Web que resuelve los
6
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
bloques de código del lado del servidor, y como compilador y motor de ejecución para los Controles Web, que en conjunto permitirán formar una respuesta bien estructurada formada por etiquetas HTML y bloques de código del lado del cliente que permitirán el manejo de eventos del lado del cliente. Este modelo brinda todas las ventajas del ambiente Web, con la funcionalidad orientada a eventos que sólo estaba disponible en aplicaciones de escritorio, llamadas también aplicaciones Windows. Antes de ver los elementos particulares de las páginas ASP.NET, debemos considerar que se trata de la alternativa de desarrollo Web de Microsoft .NET, la nueva plataforma de desarrollo de Microsoft. Si ha de desarrollar aplicaciones Web bajo el modelo de petición respuesta orientada a eventos, le conviene hacerlo en ASP.NET, debido a que proporciona todas las ventajas de los desarrollos web, y cuenta con las mejores herramientas de desarrollo y soporte en el mercado. Al ser de Microsoft, se garantiza que exista toda una comunidad de personas trabajando bajo dicha plataforma, al mismo tiempo que muchos desarrolladores y empresas estarán generando componentes y herramientas de bajo costo que pueden incrementar la productividad.
PLATAFORMA MICROSOFT.NET
La plataforma .NET, conocida también simplemente como .NET, es un conjunto de herramientas de desarrollo y lenguajes de programación, de propósito general, orientados a objetos, de tercera generación, de alto nivel, de compilación a código intermedio, que nos permiten utilizar todos los recursos disponibles en la computadora a través de una librería de clases común, con la cual se pueden desarrollar aplicaciones de Consola, basadas en Windows, y para la Web, que utilizan protocolos abiertos para la interacción entre los elementos que las componen.
al desarrollar aplicaciones empresariales.
.NET no es sólo un conjunto de lenguajes, o un producto de Microsoft metido en una caja: .NET es toda una plataforma de desarrollo, escalable, orientada a objetos que resuelve muchos de los problemas que se presentan hoy en día
En cierto modo, la evolución de la informática y la fuerte tendencia a globalizar aplicaciones a través de Internet provocó que las herramientas existentes se hicieran cada vez más inadecuadas para las necesidades de la industria del desarrollo de software, como ya hemos explicado.
www.Aprenda.mx – Knowledge Providers
7
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
.NET Framework se compone de varias capas (layers) . Las capas que componen la plataforma .NET son: 1.
Capa de lenguajes. Es la capa compuesta por el CLS y todos los lenguajes de programación compatibles con CLS. En esencia, CLS (Common Language Specification) es un convencionalismo de elementos que deben cumplir todos los lenguajes que deseen ser considerados lenguajes .NET. Inicialmente, Microsoft liberó tres lenguajes .NET: Visual Basic.NET, C#, y Managed C++, que obviamente, cumplen con las especificaciones de CLS; posteriormente liberaron J#; otras compañías están desarrollando lenguajes que cumplen con CLS, para integrarse a la plataforma .NET.
2.
.NET Framework (Infraestructura y servicios). Es la capa compuesta por el núcleo de servicios y recursos de .NET, que incluye los compiladores, la biblioteca de clases común para todos los lenguajes, y los servicios que convierten lo codificado en los lenguajes en código máquina para los diversos sistemas operativos, a través del uso de código intermedio. .NET Framework se compone de los siguientes elementos: a) Capa de servicios (Services). Se compone de aquellos servicios que permiten la intercomunicación entre los programas desarrollados en un lenguaje .NET, el resto de los elementos de .NET Framework, y los componentes del sistema operativo. Se tienen dos servicios principales: a) Windows Application Services, que apoyan a las aplicaciones en su dialogo con .NET Framework y el sistema operativo; b) ASP.NET Application Services, que apoya a las aplicaciones en su diálogo con .NET Framework, con el sistema operativo, y además con el motor de servicios Web, que en plataforma Microsoft se trata de Internet Information Server (IIS). b) Biblioteca de clases base (BCL / Base Class Library). Se trata de más de 6000 clases, distribuidas en más de 80 archivos de librería DLL, que el usuario puede utilizar en sus programas, aportando funcionalidad intrínseca en el lenguaje. Prácticamente el desarrollador sólo se tendrá que preocupar por codificar los procesos de negocio. c) Motor de ejecución común (CLR / Common Language Runtime). Es la plataforma de ejecución de los programas .NET. CLR agrupa compiladores de línea de comando que permiten la creación de código intermedio, libre de ambigüedades, al que se le da el nombre de ensamblado (assembly); contiene además los compiladores JIT (just in time compilers), que se encargan de generar código máquina a partir de los ensamblados. CLR se encarga de la gestión de errores, uso de recursos, y dialogo con el sistema operativo en tiempo de ejecución. A todo lo que requiere de la intervención de CLR para funcionar se le da el calificativo de administrado (managed).
3.
8
Soporte operativo. Es la capa compuesta por los sistemas operativos y las herramientas del mismo, que están preparadas para sacar el mejor producto de los desarrollos en .NET. En este punto se agrupan productos independientes del Back End.
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
Problemas que elimina .NET. Algunos de los problemas que se eliminan con .NET son: 1. 2. 3. 4.
El infierno de los DLL. Falta de interoperabilidad con otras plataformas. Incapacidad para el manejo de esquema orientado a objetos. Pobre manejo de errores.
Beneficios que proporciona .NET. Los beneficios que se obtienen al trabajar bajo la plataforma .NET pueden resumirse en las siguientes: 1.
Integración de lenguajes, igualmente poderosos.
2.
Existencia de una biblioteca de clases común para los lenguajes.
3.
Arquitectura abierta a nuevos lenguajes.
4.
Desarrollo simplificado.
5.
Implementación simple.
6.
Mejor soporte a componentes.
7.
Interoperación con dispositivos móviles.
8.
Rentabilidad.
PROCESAMIENTO DE PÁGINAS WEB EN .NET
El hecho de que ASP sea ahora “.NET”, pone de manifiesto que las páginas activas operan ahora bajo las reglas de funcionamiento de la plataforma .NET; no se trata de mejoras sobre la misma forma de funcionar, sino que dicha forma de funcionar sufre cambios radicales que provocan mejoras. En ASP Clásico las páginas se resolvían de modo interpretado, es decir, cada que se solicitaba una página ASP al servidor, ésta debía ser analizada, interpretada, y transformada a código HTML equivalente, el cual finalmente era remitido al cliente. En ASP.NET la forma de ejecución es distinta. Al hacer la petición, el servidor se percata que la página requerida es ASP.NET (ASPX); la página, que es tratada como un programa, primeramente es procesada por un analizador de código (Parser), que verifica que el
www.Aprenda.mx – Knowledge Providers
9
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
programa está bien escrito y que no posee errores de sintaxis o de referencias perdidas (uso de variables, procedimientos, o miembros inexistentes). Si el programa no tiene errores de sintaxis o de referencias perdidas, el programa es puesto a disposición del compilador de paginas de .NET Framework; el compilador se encargará de generar un ensamblado de extensión DLL, de nombre único, que define una clase capaz de generar el código HTML que ha de ser retornado al navegador del cliente. Este ensamblado es almacenado en un área denominada caché de ensamblados (Assembly Caché), en donde se almacenan todos los ensamblados generados por el compilador de páginas. Ya que está generado el ensamblado capaz de producir el contenido Web que ha de ser retornado al cliente, un elemento denominado HTTP Runtime se encarga de solicitar la ejecución de la clase generada, creando la instancia del objeto generador, produciendo entonces el contenido Web. El contenido Web generado por la clase es almacenado en un área denominada caché de salida (Output Caché); en ese espacio se almacenan los contenidos HTML, los scripts de ejecución del lado del cliente, e incluso los datos generados como parte de la salida. De ahí, el contenido es enviado al cliente solicitante. Si posteriormente se solicita la misma página, se buscará primeramente en Output Caché; si el contenido Web se encuentra todavía ahí, no se realizará procesamiento alguno, por lo cual la respuesta es extremadamente rápida. En el peor de los casos si el contenido Web no se encuentra en el auto caché entonces se producirá la ejecución de la clase creándose un nuevo contenido Web, lo cual de todas maneras es mucho más rápido que utilizar código interpretado.
CARACTERÍSTICAS DE ASP.NET ASP.NET es la implementación en plataforma Microsoft para aplicaciones bajo el modelo petición - respuesta dinámica orientada a eventos. Antes de ASP.NET contábamos con lo que ahora se ha dado a llamar ASP Clásico, que operaba bajo el modelo petición - respuesta dinámico. Esta tecnología está perdiendo vigencia rápidamente, ya que ASP.NET es más poderoso, sencillo y organizado; en términos generales, hay ciertas características de ASP.NET que lo están convirtiendo rápidamente en el estándar para el desarrollo Web. Las características particulares más relevantes de ASP.NET podríamos relacionarlas como sigue: Soporte a múltiples lenguajes
Con ASP.NET, es posible desarrollar en dos lenguajes: Visual Basic o C#.
Código compilado
El código se compila, de tal manera que cuando se ejecuta una página, esta no tiene que ser interpretada en el momento, lo que mejora el desempeño de las aplicaciones.
Código separado del diseño (Code Behind)
La implementación gráfica de una aplicación Web es independiente a la programación, de tal manera que se puede distribuir el trabajo entre diferentes especialidades profesionales.
10
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
Uso de bibliotecas de clase de .NET Framework
Permite utilizar la biblioteca de clases de .NET, incluyendo aquellas que permiten la creación de objetos dinámicos (Controles Web del Servidor), incrementando el poder de las aplicaciones y las tareas que es posible realizar.
Independencia del navegador
Con ASP.NET, se desarrolla una página que será vista de forma efectiva sin importar el navegador utilizado, ya que la plataforma .NET resuelve la compatibilidad.
Manejo de estado automático
La información que debe viajar entre las páginas es administrada automáticamente por la plataforma de ejecución de ASP.NET, lo que permite mayor poder a la programación.
Configuración por archivo
La configuración de los desarrollos Web se realiza a través de un archivo de texto, llamado Web.config, lo que permite evitar el uso de herramientas de administración complicadas.
Copy Deployment
La instalación de aplicaciones Web desarrolladas en .NET, puede realizarse simplemente copiando los archivos.
REQUERIMIENTOS PARA EL DESARROLLO DE ASP.NET Los requerimientos para desarrollar con ASP.NET pueden darse del lado del cliente y del lado del servidor. Recuerde que si usted utiliza su máquina con ambos roles, deberá instalar los requerimientos de ambos roles también.
Del lado del cliente, lo que se requiere es lo siguiente: 1.
2.
Navegador actualizado. Requiere de un navegador lo suficientemente actualizado para que sea capaz de interpretar las etiquetas y bloques de código del lado del cliente que las páginas ASP.NET generen como respuesta a una petición. Visual Studio. Para desarrolladores serios, lo ideal es disponer de Visual Studio, que es el entorno integrado de desarrollo de aplicaciones de .NET, mismo que proporciona herramientas gráficas para el diseño, codificación y administración de proyectos de desarrollo. a. Visual Web Developer 2010 Express Edition. Debido a que Visual Studio puede ser muy costoso para desarrolladores no profesionales, Microsoft ha liberado un producto denominado Visual Web Developer 2010 Express Edition; este producto es un entorno gráfico de desarrollo, no tan sofisticado como Visual Studio, pero que sí proporciona algunas capacidades interesantes como lo es un diseñador de páginas, la habilidad para crear estatutos SQL, crear enlazados de datos, soporte al desarrollo de aplicaciones para dispositivos móviles, soporte a servicios Web XML, así como herramientas de implementación.
www.Aprenda.mx – Knowledge Providers
11
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
Del lado del servidor se requiere lo siguiente: 1.
Motor de ejecución Web. Es el que se encargará de recibir las peticiones y resolverlas, entrando en contacto con los componentes involucrados por la página Web requerida. En el caso de plataforma Microsoft, el motor de ejecución Web se llama Internet Information Server, conocido también como IIS.
2.
.NET Framework. Es el kit de desarrollo e implementación de la plataforma .NET de Microsoft, requerida para compilar y ejecutar los lenguajes .NET que son utilizados por las páginas ASP.NET. .NET Framework provee el motor de ejecución de .NET, el HTTP Runtime, los compiladores JIT para la generación de código nativo, y la biblioteca de clases que contiene los elementos gráficos y funcionales que utilizaremos en nuestras páginas ASP.NET.
Lab.02.01: Creando un Web Site en Visual Studio 2010 En el presente ejercicio conoceremos la forma de lanzar a ejecución Visual Web Developer 2010 Express Edition, y cómo generar un Web site en el cual estaremos agregando las páginas web que vayamos creando. Este laboratorio asume que Usted ya ha instalado Visual Web Developer 2010 Express Edition, y que lo tiene funcionando en su equipo. Es importante que sepa que Visual Basic trabaja en base a Soluciones (Solutions), que permiten consolidar varios proyectos de desarrollo relacionados con un producto. Por ejemplo: Una solución puede ser un sistema Administrativo, que contiene los proyectos de Control de almacén (Windows), Contabilidad (Windows), Dashboard (Web), Procesos automáticos (Services), y así. También, a nivel archivo, tienen sus archivos, con sus respectivas extensiones.
Abriendo Visual Web Developer 2010 Express Edition. 1. En el escritorio de Windows, haga clic en el botón Iniciar. 2. Se abrirá el menú de Programas de Windows. 2.1.
12
Seleccione Microsoft Visual Web Developer 2010 Express Edition.
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
2.2.
Dado que es un subconjunto de la herramienta Visual Studio, nos referiremos a esta herramienta como “Visual Studio”, de ahora en adelante, aunque debemos estar conscientes que no se trata de la versión completa del producto.
3. Se deberá abrir la herramienta de desarrollo.
4. Los elementos que aparecen en Visual Studio son los siguientes. 4.1.
Toolbox. Ventana en donde se pueden seleccionar las diferentes etiquetas, para poderlas incluir en páginas web.
4.2.
Barra de menús. Permite seleccionar tareas que deseamos que la herramienta ejecute. La Barra de menús contiene todas las tareas que es posible desarrollar con la herramienta.
4.3.
Barra de herramientas. Al igual que la barra de menús, permite seleccionar tareas que deseamos que la herramienta ejecute, sólo que de manera más rápida. La Barra de herramientas contiene sólo las tareas más comunes. 4.3.1.
4.4.
Tomando en cuenta la acción que esté realizando, Visual Studio podrá agregar más barras de herramientas (Toolbars), a discresión.
Solution Explorer. Permite visualizar todos los archivos que componen nuestro sitio web, y nos permite agregar, eliminar y organizar los contenidos del sitio web, a nivel archivo de sistema operativo.
www.Aprenda.mx – Knowledge Providers
13
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
4.5.
Área de trabajo. Es el área en donde podremos trabajar nuestras páginas web. Esta área es muy dinámica, pues puede comportarse como herramienta de diseño, como editor de código, entre otras. 4.5.1.
Al iniciar la ejecución de Visual Studio, el Área de trabajo contendrá la página de inicio de la herramienta, llamada Start Page, que es el punto de inicio para crear o abrir desarrollos en Visual Studio, y obtener información reciente de .NET.
Creando un sitio web en Visual Studio. 1. En Start Page, identifique los vínculos de apertura y creación de proyectos y el recuadro Recent Projects.
2. Seleccione New Web Site…; al hacer esto, se generará un sitio web para su desarrollo en Visual Studio.
14
2.1.
Al instalar Visual Studio, se agrega en Mis Documentos un directorio llamado Visual Studio 2010. Dentro de ese directorio, se encuentra otro denominado Web Sites.
2.2.
Todos los sitios web que se creen en Visual Studio en modalidad de File System, se guardarán en dicho directorio.
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
3. Aparecerá la ventana New Web Site.
4. Los elementos de dicha ventana son los siguientes: 4.1.
Visual Studio Installed Templates. Expone plantillas de los diferentes tipos de desarrollos web que pueden crearse desde Visual Studio. Dependiendo la plantilla seleccionada, serán los archivos iniciales creados por la herramienta, para iniciar el proyecto con lo más básico. 4.1.1.
Las plantillas están disponibles para su uso con los lenguajes soportados. Se puede seleccionar Visual Basic o Visual C#.
4.1.2.
En nuestro caso, como desarrollaremos sólo páginas estáticas, es irrelevante qué lenguaje escojamos.
4.2.
Online Templates. Expone las plantillas disponibles en línea.
4.3.
Web Location. Se compone de dos especificaciones que permiten indicar la ubicación en donde se desean generar los archivos que componen el sitio web: 4.3.1.
Se tiene un combo en donde se selecciona la forma en que se quieren guardar y utilizar los archivos que componen el sitio. Las opciones son: File System, si deseamos que se guarden en el directorio Web Sites mencionado en el punto 7.1; HTTP, si se desea almacenar en un servicio público HTTP; y FTP, si se desea almacenar en un servicio público FTP.
4.3.2.
Se tiene un cuadro de texto para especificar el nombre del sitio web que queremos crear. Se puede utilizar el botón Browse…, si se desea buscar un directorio específico dentro del equipo.
5. Para generar nuestro sitio web, especifiquemos lo siguiente en la ventana New Web Site:
www.Aprenda.mx – Knowledge Providers
15
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
5.1.
Nos interesa crear un sitio web con páginas HTML, así que seleccione en Installed Templates el lenguaje Visual Basic. Con ello aparecerán todas las plantillas disponibles para ese lenguaje.
5.2.
Seleccione de la lista la plantilla ASP.NET Web Site, que es lo más apropiado para nuestra necesidad.
5.3.
En Web Location, especificamos que queremos que el sitio web se almacene como File System. 5.3.1.
5.4.
El nombre por omisión del web site es «WebSite1». Decidimos cambiarlo por «Curso». En el cuadro de texto, sustituya «WebSite1», por «Curso».
Haga clic en Ok, para que el sitio web se genere atendiendo las especificaciones que hemos hecho.
6. Crear un sitio web desde Visual Studio en File System, implica que se genere un directorio en \Mis Documentos\Visual Studio 2008\Web Sites\, con el nombre del sitio que hayamos determinado (en este caso Curso). En ese directorio se generará lo siguiente: un directorio para soporte a datos, denominado App_data; un archivo de configuración del sitio, llamado web.config; una página web dinámica por omisión, llamada Default.aspx, con su correspondiente archivo de código, llamado Default.aspx.vb. 7. El Área de trabajo se convierte en un editor de código, mostrando la página Default.aspx.
WBASP2010.01.01.wmv
16
Indica la existencia de un video clip que muestra de forma gráfica la realización de las tareas descritas en el ejercicio.
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
Eliminando archivos usando Visual Studio. 8. Los archivos llamados Default o Index, con extensiones .ASP, .ASPX, .HTM, .HTML, tienen un significado especial dentro de la web, ya que son considerados página inicial de sitio. Esto se hace para no tener que colocar el nombre del archivo en el URL. La desventaja es que el sitio pretenderá mostrar esas páginas por omisión. 9. Crearemos nuestras propias páginas, y por lo tanto, no necesitamos la página Default.aspx, ni su archivo de código, procedemos a eliminarlos de nuestro web site. 10. Identifique la herramienta Solution Explorer.
11. Ubique el archivo Default.aspx en el árbol de elementos (Items) de Solution Explorer. 12. Haga clic en el ícono que aparece a la izquierda del nombre del archivo, para seleccionarlo. 12.1. No haga clic sobre el nombre porque Visual Studio entenderá que se desea cambiar el nombre del archivo, y no es lo que deseamos hacer. 13. Una vez seleccionado el archivo, puede presionar la tecla SUP (DEL), o invocar el menú de contexto haciendo clic en el botón alterno del mouse, y seleccionar la opción Delete. 14. Cuando aparezca la ventana de diálogo para confirmar la eliminación, seleccione Aceptar (Ok). 15. El archivo Default.aspx y sus archivos asociados (como el código), han sido eliminados. 16. Visual Studio estará mostrando Start Page. WBASP2010.01.02.wmv
www.Aprenda.mx – Knowledge Providers
17
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
Archivos generados. 17. Visual Studio habrá generado algunos archivos por usted. 17.1. Abra el Windows Explorer. Vaya a \Mis Documentos y siga la jerarquía de archivos hasta que llegue a \Visual Studio 2010\Projects. Encontrará: 17.1.1.
Un archivo de extensión .sln, que contiene la información de la solución de Visual Studio, y sus componentes.
17.1.2.
Un archivo de extensión .suo, que contiene las opciones de usuario de la solución, que ayuda a recordar en que estaba trabajando la última vez que modificó la solución.
17.2. Ahora vaya a \Visual Studio 2010\WebSites\Curso. Encontrará: 17.2.1.
Páginas Web (.ASPX)
17.2.2.
Páginas Maestras (.MASTER)
17.2.3.
Páginas de configuración (.CONFIG)
17.2.4.
Páginas de código (.VB, .CS)
17.2.5.
Páginas HTML (.HTML)
17.2.6.
Otras.
17.3. Hay varios directorios, que contienen funcionalidades adicionales para el sitio.
FIN DEL EJERCICIO
Lab.02.02: Presentación ejecutiva Usted trabaja en un despacho de reclutamiento y selección de personal. Una de las grandes tareas del despacho es la recopilación de información de prospectos, que hoy en día se realiza de la siguiente manera: a) Los prospectos envían por correo electrónico, o acuden personalmente a las oficinas, a dejar su resumen profesional; b) en el despacho se reciben los documentos, se clasifican, y se vacían los datos en una aplicación Windows que se tiene instalada en tres máquinas dentro de la compañía, misma que alimenta una base de datos de prospectos; c) se corroboran los datos de contacto de los prospectos, a fin de saber si se les puede contactar en caso de ser necesario. El director General dice que estaría bien una nueva aplicación para la recopilación de datos. Algunos se muestran optimistas, y piensan que se desarrollará una nueva versión de la aplicación ya existente, y que las cosas se seguirán haciendo igual. Usted no opina lo mismo, pues cree que la organización debería tener una página en Internet en la cual los prospectos alimenten directamente su información, y que dicha información se almacene en la base de datos de la empresa, como siempre ha sido. Algunos de los beneficios son que en la empresa ya no se tendrá que capturar la información, con lo cual las tres personas que se encargan de captura pueden ser empleadas en otra cosa; además, es más ecológico, pues se elimina el uso de papel en general. El director General le da un espacio para que explique a todos los gerentes su propuesta de una aplicación Web para la recopilación de información de prospectos.
18
www.Aprenda.mx – Knowledge Providers
Módulo 1: Generalidades de ASP.NET
Elabore una presentación en Power Point, con la cual: 1.
Explicará la situación actual y la situación esperada.
2.
Explicará por qué conviene cambiar a un desarrollo Web, en lugar de la aplicación Windows que ya se tiene.
3.
Sugiera la utilización de la tecnología ASP.NET, para desarrollar el proyecto.
Esa presentación será utilizada para una exposición ejecutiva. Apoyándose en su presentación, debe convencer de que el desarrollo nuevo sea en ambiente Web, y utilizando la tecnología ASP.NET. Recuerde que es una presentación ejecutiva, no técnica. Deberá ubicar las ventajas del desarrollo Web contra otras plataformas, y explicar dichas ventajas en términos de lo que a la empresa le interesa: utilidades y simplificación.
FIN DEL EJERCICIO
www.Aprenda.mx – Knowledge Providers
19
Aprenda Workbook – Programación ASP.NET usando Visual Studio 2010
EXAMEN RÁPIDO DEL CAPÍTULO Parte 1: Marque con una cruz el inciso que considere que responde a la pregunta. 1.
Es el modelo de aplicación Web en donde el cliente puede detectar la interacción del usuario, y hacer peticiones automáticas al servidor en consecuencia. a) Petición – Respuesta b) Petición – Respuesta Dinámica c) Petición – Respuesta Dinámica orientada a eventos 2. a) b) c)
Es donde se encuentra el motor de ejecución Web. En el cliente En el servidor En Internet Information Server
3. a) b) c)
Es el componente de .NET Framework que se encarga de la ejecución de los programas. BCL CLR CLS
4.
Característica de ASP.NET asociado con la posibilidad de implementar de forma muy sencilla un desarrollo. a) Mayor seguridad b) Mayor escalabilidad c) Copy Deployment 5. a) b) c)
Archivo de configuración de una aplicación en ASP.NET Cnfig.Web ASP.Config Web.Config
Parte 2: Coloque en la línea la letra «F» si la sentencia es falsa, y «V» si la sentencia es verdadera.
20
_______
6.
Los negocios de alcance global utilizan Internet como red debido a que el costo de una red global privada es muy alto.
_______
7.
Para ejecutar aplicaciones ASP.NET el servidor debe disponer de .NET Framework
_______
8.
ASP.NET permite desarrollar en diferentes lenguajes de programación.
_______
9.
Es mejor desarrollar en PHP que en ASP.NET, porque es más sencillo.
_______
10. Las páginas Web en ASP.NET tienen la extensión ASPX.
www.Aprenda.mx – Knowledge Providers
Unidad de aprendizaje 2
Aprenda Workbook – Programación ASP.NET 2010
CONTENIDO Estructura básica de una página ASP.NET ..................................................................................................... 3 Parte visual .................................................................................................................................................... 4 La jerarquía de la lista anterior indica de cierta forma el nivel de dependencia entre los elementos. ................................................................................................................................................ 4 ..................................................................................................................................................... 4 ........................................................................................................................................... 6 ....................................................................................................................................... 7 ............................................................................................................................. 8 Integrando un control Web (Web Control) ........................................................................................... 9 Integrando un control HTML (HTML Control) ..................................................................................... 10 Integrando un control de validación (Input Validation Control) ......................................................... 10 Código .......................................................................................................................................................... 11 Lab.03.01: La primera página ASP.NET ............................................................................................... 12 Anclando herramientas en el entorno de desarrollo .......................................................................... 14 Agregando una página Web al proyecto ............................................................................................. 14 Modos de visualización en el Diseñador de páginas ........................................................................... 15 Agregando Web Controls a una página ............................................................................................... 15 Agregando código a una página .......................................................................................................... 17 Ejecutando la página ........................................................................................................................... 18 Lab.03.02: Reconociendo elementos en una Página Web.................................................................. 19 Examen rápido del módulo ......................................................................................................................... 20
2
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
ESTRUCTURA BÁSICA DE UNA PÁGINA ASP.NET En muchos sentidos, una página Web desarrollada en ASP.NET es una página común, que al ser invocada en el servidor, será compilada y ejecutada por .NET Framework y IIS. Las páginas web desarrolladas en ASP.NET tienen la extensión ASPX, y son archivos de código textual que no requiere de ninguna herramienta especial para ser desarrollados; basta tener un editor de texto plano para hacerlas, aunque claro está, apoyarse en una herramienta de desarrollo gráfico, como Visual Studio o Visual Web Developer 2010 Express . En el presente texto, al referir «páginas Web», estaremos haciendo mención a páginas Web ASP.NET, de extensión ASPX. Al invocar una página ASP.NET, el servidor generará un ensamblado que resolverá los elementos que componen la página en sus equivalentes funcionales codificados en HTML, VBScript, y JScript. Ya que la página ha sido resuelta, se envía al cliente que la solicitó. La siguiente figura ilustra la estructura básica de una página Web en ASP.NET.
Partimos del hecho de que una página ASP.NET es una página Web, y por tanto, tiene una apariencia que será vista en un navegador, a esta parte de la página le llamamos parte visual, y está compuesta principalmente por una página de extensión ASPX. Por otro lado, las páginas ASP.NET son dinámicas, es decir, están preparadas para ejecutar código a medida que el usuario interactúa con a página. A esta parte de la página le llamamos código, y está compuesta por un programa de extensión VB o CS, dependiendo del lenguaje, y que está asociada a la página que utiliza el código. Es por ello que al código se le ha dado el nombre de Code Behind, pues en el momento de desarrollo está ahí como soporte a la funcionalidad de la página, más sin embargo, el usuario final de la página, es decir, quien la utiliza desde el navegador, nunca verá dicho código.
www.Aprenda.mx – Knowledge Providers
3
Aprenda Workbook – Programación ASP.NET 2010
PARTE VISUAL Analicemos primeramente la parte visual de una página web ASP.NET, que está representada básicamente por un archivo de extensión ASPX. En general, una página Web es exactamente igual que una página Web HTM: está basada en etiquetas, tiene un delimitador de página (html), una especificación de encabezado (head), y el cuerpo visible de la página (body), sin embargo tiene algunos cambios. En una página ASPX encontraremos generalmente lo siguiente: 1.
Directivas
2.
Contenido HTML
3.
Bloques de servidor a.
Encabezado de servidor
b.
Formulario de servidor a) Controles Web (Web Controls) a.
Controles de validación (Input Validation Controls)
b) Controles HTML (HTML Controls) La jerarquía de la lista anterior indica de cierta forma el nivel de dependencia entre los elementos.
Las directivas son especificaciones de atributos que utilizará la página y los compiladores al procesar páginas Web en ASP.NET. Las directivas se colocan al principio de la página, en todos los casos, pues determinan la manera en como el resto de la página deberá ser considerada por .NET Framework. Para declararlas se utiliza la siguiente sintaxis, que se coloca al inicio de la página Web: <%@ NombreDirectiva [ Atributos ] %> Donde NombreDirectiva es el nombre de la directiva que se desea incluir, mientras que Atributos son los atributos y sus valores, expresados en pares igualados (propiedad = valor); los atributos se separarán entre sí por espacios en blanco. Las directivas más importantes son las siguientes:
4
1.
@ Assembly. Vincula una librería (ensamblado) de forma declarativa a la página. Esto permite utilizar clases ya codificadas, en la página.
2.
@ Control. Define atributos específicos para poder utilizar controles desarrollados por el usuario. Sólo puede incluirse para asociar User Controls (.ASCX, controles de usuario de ASP.NET).
3.
@ Implements. Indica de forma declarativa que una página o un control de usuario utiliza una interfaz de .NET Framework.
4.
@ Import. Importa explícitamente un espacio de nombres en una página o un control de usuario.
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
5.
@ Master. Identifica la página que determina el estilo general del sitio Web (llamadas Master Page). Se asocian archivos de extensión .MASTER.
6.
@ OutputCache. Controla de forma declarativa la normativa de caché de resultados de una página o control de usuario.
7.
@ Page. Define atributos específicos de página utilizados por el analizador sintáctico y el compilador de páginas ASP.NET. Sólo puede incluirse en archivos .ASPX (formularios Web de ASP.NET).
8.
@ Reference. Vincula de forma declarativa una página o un control de usuario a la página o control de usuario actual.
9.
@ Register. Asocia alias a nombres de espacios de nombres y clases, que permiten la representación de controles de usuario y controles de servidor personalizados cuando se incluyen en una página o un control de usuario solicitados.
Una de las directivas de más útil es la directiva @Page. las siguientes.
Algunos atributos importantes de esta directiva son
a) AutoEventWireUp. (Boolean). Indica si los eventos de la página están interconectados de manera automática. El valor True implica que la conexión de eventos está habilitada. Los eventos producidos por los controles Web trabajan de manera diferente a los eventos en los formularios de cliente tradicionales o en aplicaciones Web basadas en cliente. La diferencia se basa principalmente en la separación existente entre el propio evento y el lugar donde se controla el evento. En las aplicaciones basadas en cliente (Windows o ASP Clásico), los eventos se producen y controlan en el cliente. En las páginas ASP.NET, los eventos se producen en el cliente, pero son controlados en el servidor. b) Buffer. (Boolean). Determina si el búfer de respuestas HTTP está habilitado. c) ClassName. (String). Especifica el nombre de la clase que será compilada de manera dinámica en caso de ser requerida. d) CodeBehind. (String). Especifica el nombre del archivo que contiene el código asociado a la página. Este código será un programa que contendrá una clase que le dará comportamiento a la página Web. De esta forma podrá separarse el código de la interfaz. El diseñador de formularios de Visual Studio .NET usa este atributo al desarrollar una página Web utilizando dicha herramienta. e) CompilerOptions. (String). Cadena que contiene opciones del compilador para compilar la página; se trata de la secuencia de modificadores que utilizaríamos al compilar desde línea de comandos. f)
Debug. (Boolean). Indica si la página se debe compilar con símbolos de depuración o no. En ocasiones sólo se obtiene información relevante a los errores aplicando este atributo. Por omisión tiene el valor de False.
g) EnableViewState. (Boolean). Indica si se mantiene el estado entre solicitudes de página, de manera automáticamente. Si el valor es True, el estado entre las páginas se manejará a través del objeto oculto _VIEWSTATE. h) ErrorPage. (String). Define una dirección URL de destino para la redirección cuando se produce una excepción de página no controlada. i)
Inherits. (String). Define la clase de código en segundo plano que hereda la página. Ésta puede ser cualquier clase derivada de la clase Page.
j)
Language. (String). Especifica el lenguaje utilizado cuando se compilan todos los bloques de procesamiento en línea (<% %> y <%= %>) y de declaraciones de código dentro de la página. Los valores
www.Aprenda.mx – Knowledge Providers
5
Aprenda Workbook – Programación ASP.NET 2010 pueden representar cualquier lenguaje compatible con .NET, incluidos Visual Basic.NET (vb), C# (C#) o JScript .NET. k) Theme. String. Especifica el nombre del tema que será aplicado en la página. Otra de las directivas útiles es la directiva @Imports, que permite importar espacios de nombres para nuestras páginas. Veamos ejemplos del uso de @Page y @Import. Para determinar a Visual Basic.NET como nuestro lenguaje para la codificación de código declarativo. <%@ Page Language=”vb” %> Para, además, especificar la depuración avanzada. <%@ Page Language=”vb” Debug=”True” %> Para determinar el programa MiCodigo.vb como repositorio de nuestro código. <%@ Page Language=”vb” CodeBehind=”MiCodigo.vb” %> Para importar el espacio de nombres que se requiere para trabajar con datos. <%@ Import Namespace=”System.Data” %> Con los elementos revisados hasta el momento, podríamos tener una página de la siguiente forma. Esta página irá evolucionando a medida que vayamos entendiendo más elementos.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1" %>
Las páginas ASP.NET son páginas que soportan HTML. Después de haber colocado las directivas, las etiquetas HTML pueden colocarse prácticamente en cualquier lado. Una diferencia importante es que las páginas ASP.NET son rigurosas en el manejo de etiquetas, pues cuidan que cada etiqueta abierta se cierre debidamente, además de que su sintaxis sea correcta en estricto sentido. Anteriormente, las páginas equivocadas simplemente no funcionaban como debían; en ASP.NET, no sólo no funcionarán, sino que marcarán error al ser analizadas por el Parser. Por contenido HTML nos referimos a etiquetas HTML, manejo de estilos, bloques de código del lado del cliente, declaración de objetos COM, etcétera. Esto quiere decir que sus páginas funcionarán como funcionaban antes; en caso de que utilicen componentes COM, estos no necesariamente tendrán que ser codificados y compilados en su forma equivalente para .NET.
6
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
Con los elementos revisados hasta el momento, podríamos tener una página de la siguiente forma.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> </head> <body>
</body> </html>
Los Bloques de Servidor son aquellos bloques que se desean ser procesados en el servidor, y no en el cliente. En el caso de las páginas ASP.NET, los dos bloques del servidor principales son el encabezado (<head>), y el formulario (<form>), que va dentro del bloque de cuerpo (<body>). Para que un bloque sea reconocido como “del servidor”, es necesario agregarle la directiva runat=server. Al agregarla, se le dice al cliente (generalmente un navegador), que el contenido HTML no debe ser resuelto del lado del cliente, sino que el servidor se encargará de hacer un procesamiento que retornará un contenido. Los objetos que poseen la especificación runat=server no son definitivos para el navegador. .NET Framework producirá una clase que resolverá todos los contenidos del servidor, produciendo una página adecuada para el navegador y la plataforma que se está utilizando para leer la página. Esto es excelente, pues el código que tendría que desarrollar para un navegador Internet Explorer no es igual que el código que habría que desarrollar para Mozilla, o para una plataforma Android; pues bueno: todo lo que nosotros definamos con la especificación runat=server no nos causará problemas de compatibilidad. Al mandar llamar la página ASP.NET, el motor de ejecución de .NET Framework reconocerá desde qué plataforma se está haciendo la petición (IE, Mozilla, Android), generará la versión HTML compatible para dicha plataforma, y eso es lo que el servidor retornará al cliente. Para que los contenidos de la página puedan disfrutar de esa ventaja, es necesario que se encuentren en lo que se conoce como formulario del servidor, que consiste en un bloque <form> con la especificación runat=server, como todo en ASP.NET. Ya que contamos con un formulario del servidor, podemos colocar diversos objetos dentro de él. Un formulario del servidor permitirá especificar controles Web del servidor, de tal manera que puedan ser procesados por .NET Framework del lado del servidor. A una página de extensión ASPX que contiene un formulario del servidor dentro del cual se definen diversos controles del servidor, se le da el nombre de Web Form.
www.Aprenda.mx – Knowledge Providers
7
Aprenda Workbook – Programación ASP.NET 2010 Una novedad es que también se puede especificar el encabezado de la página (<head>) como runat=server, con lo cual se abarca la totalidad de la página en dicha modalidad. Con los elementos revisados hasta el momento, podríamos tener una página de la siguiente forma.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> </div> </form> </body> </html>
LISTADO DE CÓDIGO. Este documento de trabajo ilustra codificación ASPX, VB, o de cualquier otro tipo. Tiene la característica de tener numeradas las líneas de código. Si desea elaborar un documento de este tipo, busque el Template WB.LISTADO DE CÓDIGO.DOCX, en el CD complementario.
Observe cómo en la línea 8 se agregó la especificación runat=server, para el encabezado; esto permitirá que dentro del encabezado se puedan colocar elementos con la especificación runat=server, dentro del bloque (8 a 10). También, se agregó un formulario del servidor, que abarca desde la línea 12 a la 16, dentro del cual se podrán agregar elementos con la especificación runat=server. En caso de que se agreguen elementos del servidor fuera del bloque de encabezado de servidor o formulario del servidor, la página generará error.
Los controles Web del servidor son implementaciones de funcionalidad basada en etiquetas, a través de los cuales se le ordena a la clase generada que construya contenido HTML dinámico, sensible a eventos, aplicable a un navegador dado. Los controles del servidor se invocan en las páginas Web a través de etiquetas, y pueden ser de los siguientes tipos básicos: 1.
8
Controles Web (Web Controls). Llamados también intrínsecos; son los que poseen la máxima funcionalidad brindada por ASP.NET, para la construcción de código HTML dinámico, sensible a eventos.
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
a.
Controles de validación (Input Validation Controls). Son una forma de control Web complementario, que tiene como objeto validar la entrada de datos en otro control que consume sus servicios.
2.
Controles HTML (HTML Controls). Son aquellos cuyo propósito es sólo generar una equivalencia estándar de código HTML, generado por el servidor.
3.
Rich Controls. Son una forma de control Web de alta funcionalidad y complejidad, que pueden incluso conformarse por varias etiquetas. Este es el caso del control Calendar.
Los controles Web tienen comportamiento interconstruido (built-in), lo que significa que poseen sus propios métodos, propiedades y eventos, mismos que se pueden utilizar en programación orientada a objetos en la codificación de las páginas. Las propiedades, métodos y eventos de todos los controles son muy estándar, por lo que aprender a manejar un control es equivalente a haber aprendido a manejarlos casi todos. A continuación se verá cómo se integra cada uno de estos controles. Integrando un control Web (Web Control) La sintaxis que deberá reunir la etiqueta que llame a un control Web del servidor es la siguiente:
<asp:NombreControl id=”NombreObjeto” [propiedades] runat=”server” />
Si analizamos la línea encontraremos los siguientes elementos: 1.
Selección del control. Se deberá abrir la etiqueta normal. En el caso de los controles Web y los controles de validación, deberá agregarse la especificación «asp:»; de esta forma, el analizador de la página asociará la etiqueta con el espacio de nombre System.Web.UI.WebControls. Posteriormente se agrega el nombre del control del servidor que se desea utilizar. En el ejemplo, NombreControl es el nombre del control del servidor que se desea invocar. Es necesario especificar qué control del servidor es que queremos que el servidor resuelva.
2.
Identidad del objeto. Se deberá identificar a cada uno de los controles, a fin de que sean utilizables de manera programática; esto se logra a través de la propiedad id, a la cual se le asigna un nombre válido de objeto (NombreObjeto). No se admiten espacios y caracteres especiales; por regla general, inicie los nombres con una letra o un guión bajo.
3.
Propiedades. Se podrán asignar a un control del servidor diversas propiedades (propiedades), colocando el nombre de la propiedad y su valor, en pares igualados (propiedad = valor); las propiedades se separarán entre sí por espacios en blanco.
4.
Referencia de ejecución en el servidor. Es muy importante que al final se incluya la referencia «runat=server», ya que de otra manera el servidor no se dará por enterado de la existencia de la etiqueta, tratará de resolverla del lado del cliente, no provocando ningún efecto.
5.
Cerrado de la etiqueta. Se puede cerrar la etiqueta de un control del servidor aplicando el cerrado estilo XML (/>), en el caso de los controles Web y de los controles de validación, y utilizando cerrado
www.Aprenda.mx – Knowledge Providers
9
Aprenda Workbook – Programación ASP.NET 2010 normal (>) en el caso de los controles HTML, siempre u cuando la etiqueta no vaya seguida por contenido. Para aquellas etiquetas que afectan un contenido determinado, es decir, que tienen una etiqueta de inicio y una etiqueta de conclusión, y donde todo lo que está entre ambas se ve afectado por ellas, se deberá aplicar el cerrado estilo HTML (</etiqueta>). Sólo siguiendo la sintaxis correcta las etiquetas serán reconocidas como controles. Este sería un ejemplo de la forma en que se puede agregar un control web para un cuadro de texto. 1 2 3 4
<asp:TextBox ID="Domicilio" runat="server" TextMode="MultiLine" Rows="4" MaxLength="140" Width="350"> </asp:TextBox>
La especificación asp:TextBox (línea 1), le indica a .NET Framework que se trata de un objeto basado en la clase System.Web.UI.WebControls.TextBox, disponible en la librería Sytem.Web.dll. La especificación ID señala que para efectos de programación, el objeto se llamará Domicilio. La especificación runat=server hace que el control sea interpretado por el servidor. El resto de propiedades son opcionales, y determinan la apariencia y comportamiento del objeto: TextMode indica que el cuadro de texto será de varias líneas; Rows indica que tendrá 4 líneas, MaxLenght indica que el cuadro de texto permitirá como máximo 140 caracteres; finalmente, Width indica que el cuadro de texto tendrá un ancho visible de 350 pixels. Vea cómo en la línea 4 se cierra apropiadamente la etiqueta. Integrando un control HTML (HTML Control) Integrar un control HTML del servidor es muy similar a integrar una etiqueta HTML; la única variación es que debe agregarse la especificación «runat=server» dentro de la etiqueta. Se agrega dicha especificación para garantizar que el servidor IIS, en conjunto con .NET Framework, se encarguen de producir el equivalente HTML, funcional para todos los navegadores. Si desarrolla ASP.NET y prueba usando Internet Explorer no notará beneficio, pero si desea que sus aplicaciones sean globales y funcionales por muchos navegadores, el uso de controles HTML es casi obligado. El siguiente ejemplo muestra cómo sería utilizar un control HTML para la creación de un vínculo (Link / Anchor):
1 2 3 4 5 6
<a id="MiLiga" href="http://www.aprenda.mx" runat="server"> Ir al sitio Aprenda Practicando </a>
Esta liga generaría un vínculo hacia la página de aprenda practicando, aplicable para el navegador que hizo la petición. Como puede ver, el código de la etiqueta <a> es idéntica a la que utilizaría en una página HTML, con la diferencia de la especificación runat=server. Integrando un control de validación (Input Validation Control) Un control de validación es un tipo especializado de control Web; la diferencia con un control Web es que los controles de validación siempre se subordinan a un control Web definido previamente. Un control de validación generalmente cuenta con una propiedad llamada ControlToValidate, que contendrá el nombre del control que es validado a través del control de validación.
10
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
Este tipo de control provoca la generación de etiquetas HTML, y además scripts en JScript y VBScript, que se encargarán de garantizar, del lado del cliente, que la entrada de datos sea válida. El siguiente ejemplo muestra cómo se generaría un control de validación, que no permitiera omitir el valor del objeto al que llamamos Domicilio:
1 2 3 4
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="El Domicilio no puede omitirse" ControlToValidate="Domicilio" Display="Dynamic" Text="*"> </asp:RequiredFieldValidator>
La especificación asp:RequiredFieldValidator (línea 1), le indica a .NET Framework que se trata de un objeto basado en la clase System.Web.UI.WebControls.RequiredFieldValidator, disponible en la librería Sytem.Web.dll. La especificación ID señala que para efectos de programación, el objeto se llamará RequiredFieldValidator1. ControlToValidate indica el control Web sobre el cual aplicará la validación, que en este caso es Domicilio. La especificación runat=server hace que el control sea interpretado por el servidor. El resto de propiedades son opcionales, y determinan la apariencia y comportamiento del objeto: ErrorMessage indica el mensaje de error que aparecerá en el resumen de errores, en caso de que la validación no se cumpla; Display indica la forma en que aparecerán las notificaciones de error; finalmente, Text es el texto que aparecerá cuando la validación no cumpla. Vea cómo en la línea 4 se cierra apropiadamente la etiqueta.
CÓDIGO Algo que debe entender muy bien al desarrollar con ASP.NET, es que la parte visual consume la funcionalidad de una clase diseñada para darle servicio. Cuando estando desarrollando una página en Visual Studio, se edita código para la página, la herramienta Visual Studio genera el código de una clase con el mismo nombre que la página, pero con la extensión .vb, que estará ligado a la página a través de la directiva @Page: la especificación CodeBehind indicará el nombre del programa de código asociado, mientras que la especificación Inherits permite indicar el nombre que tendrá el espacio de nombres que atenderá las peticiones de ejecución de eventos de la página. Este tema quedará más claro cuando se vea la forma en que se asocia una página a una clase. Es importante que sepa que cada control utilizado en la página web es importado al código, ya que en dicho programa se codificará todo el comportamiento de los objetos incluidos en la interfaz: quedan los códigos de validación, enlazado de datos, comportamientos especiales, eventos, etcétera. Por esa razón, antes de poder darles servicio, el programa tiene que reconocer la existencia de los controles utilizados. Al mandar a ejecutar la aplicación, el código se compila junto con las clases de los demás proyectos de la solución, creando una librería con el mismo nombre de la solución, con la extensión .DLL, misma que queda a disposición todas las páginas del sitio.
www.Aprenda.mx – Knowledge Providers
11
Aprenda Workbook – Programación ASP.NET 2010
Lab.02.01: La primera página ASP.NET Este ejercicio tiene como principal objetivo demostrar la creación de una página Web ASP.NET. Los elementos que se integrarán no serán explicados a fondo, ya que en las próximas unidades de aprendizaje es donde se revisará a detalle cada uno de los elementos de la página. Es necesario haber desarrollado el Lab.02.01, para iniciar el presente ejercicio. Si no tiene abierta la solución, puede abrirla utilizando el archivo Curso.sln, que se encuentra en \Visual Studio 2010\Projects\Curso, en el directorio \Mis Documentos. Tome en cuenta que cada programa que desarrolle, deberá lucir de alguna manera, y además deberá funcionar de alguna manera En este ejercicio utilizaremos algunos recursos típicos de la programación, que si bien es cierto no forman parte de ASP.NET, le ayudarán sin duda al aprendizaje de la técnica. En este ejercicio, desarrollará un programa que debe lucir como sigue. Tratamos de exagerar en lo burdo del dibujo, sólo para que se dé cuenta que es irrelevante la perfección de las formas:
INTERFAZ. Este documento de trabajo permite visualizar a grandes rasgos cómo es que la interfaz de usuario de un programa debe lucir. A partir de esta representación, el programador hará la magia de transformarlo a un programa funcional. Lo único que se necesita es una hoja blanca, y con qué escribir.
Ya que ha definido la manera en cómo debe visualizarse su programa, es necesario que pueda explicar qué es lo que hace y cómo es que se comporta. Para ello, utilizamos una herramienta que se llama especificación de programa.
12
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
Nombre del programa: Primera.aspx Caso hipotético: El objetivo es demostrar el uso de Visual Studio para la creación de aplicaciones, integrando algunos elementos típicos. No tiene aplicación en alguna situación real.
Puntos de función: 1.
Debe preguntar un Nombre, mismo que deberá proporcionarse de forma obligatoria.
2.
Si el Nombre se omite, al presionar el botón se debe manifestar el error, mostrando un asterisco al lado del objeto que causó el error.
3.
Si el Nombre no se omite, al presionar el botón debe mostrarse un mensaje que dé a entender que se han hecho las cosas bien.
ESPECIFICACIÓN DE PROGRAMA. Este documento de trabajo permite especificar lo siguiente: a) El nombre físico del programa (Nombre); b) La situación hipotética que describe la situación en la cual, en el mundo real, podría necesitarse desarrollar el programa (Caso hipotético); c) Funcionalidad del programa, es decir, qué queremos que haga y sobre todo, cómo esperamos que se comporte al interactuar con el usuario. Si desea elaborar un documento de este tipo, busque el Template WB.ESPECIFICACIÓN DE PROGRAMA.DOCX, en el CD complementario.
Finalmente, nuestra interfaz lucirá como sigue (algunos objetos no son visibles, sino en tiempo de ejecución):
www.Aprenda.mx – Knowledge Providers
13
Aprenda Workbook – Programación ASP.NET 2010 Anclando herramientas en el entorno de desarrollo 1. Es posible que en el desarrollo de aplicaciones queramos tener disponibles ciertas herramientas de manera permanente. Para hacer esto, Visual Studio permite “anclar” las herramientas en la pantalla. Algunas de las herramientas típicas son las siguientes: 1.1.
Solution Explorer (Explorador de soluciones). Puede obtenerse a través del menú View, Other Windows, Solution Explorer, o presionando CTRL+ALT+L
1.2. ToolBox (Caja de herramientas). Puede obtenerse a través del menú View, Other Windows, ToolBox, o presionando CTRL+ALT+X 1.3.
Properties Window (Ventana de propiedades). Puede obtenerse a través del menú View, Other Windows, Properties Window, o presionando F4
2. Cada una de ellas tiene un icono de anclaje que se encuentra en la esquina superior derecha ( ), que es como una pequeña chincheta. Si el icono está vertical, la herramienta estará siempre visible. Si el icono está horizontal, la herramienta estará oculta y sólo se verá una pequeña pestaña vertical, que al pasar el puntero de ratón sobre ella, provocará que la herramienta sea visible. 3. Invoque ToolBox (CTRL+ALT+X), y cuando aparezca, ancle la herramienta, en caso de que no esté anclada aún. WBASP2010.02.01.wmv 4. Haga lo mismo con Solution Explorer.
Agregando una página Web al proyecto 5. Para agregar una página ASPX al proyecto curso, siga los siguientes pasos: 5.1.
En Solution Explorer, seleccione el nodo que corresponde al proyecto (C:\..\Curso).
5.2.
Agregue un nuevo elemento (Add New Item). Tiene las siguientes alternativas:
5.3.
14
5.2.1.
Invocando el menú de contexto, seleccionando Add New Item
5.2.2.
Presionando CTRL+SHIFT+A
5.2.3.
Usando el Menú WebSite, Add New Item.
Aparecerá la ventana Add New Item, que permite especificar las características del elemento que se desea agregar. 5.3.1.
En Installed Templates, seleccione Visual Basic, para indicar que el código que utilizaremos en el proyecto está en ese lenguaje.
5.3.2.
Luego seleccione Web Form, para indicar que desea un formulario Web.
5.3.3.
En Name, especifique Primera.aspx.
5.3.4.
Asegúrese que tiene marcado el cuadro de verificación Place code in separated file.
5.3.5.
Presione Add.
5.3.6.
Vea cómo automáticamente se agrega una página ASPX al proyecto, con el mínimo de codificación colocada automáticamente.
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
WBASP2010.02.02.wmv Modos de visualización en el Diseñador de páginas 6. El Diseñador de formularios Web (Web Forms Designer) es una potente herramienta que asiste el proceso de creación de interfaces web y codificación de comportamientos asociados a las mismas. En general, tiene tres modos de visualización: 6.1.
Design (Diseño). Se muestra la página de forma visual.
6.2.
Source (Código). Se muestra la página desde la perspectiva del código.
6.3.
Split (Dividido). Se muestra tanto la forma visual como de código.
7. En la parte inferior del Web Forms Designer, haga clic en las pestañas de los diferentes modos. 8. Finalmente, deje el Web Forms Designer en modo Design. WBASP2010.02.03.wmv Agregando Web Controls a una página 9. Para agregar un Web Control a una página, tenemos que hacer lo siguiente: 9.1.
Arrastrar desde ToolBox el Web Control que deseamos integrar, colocándolo en lugar en donde lo queremos.
9.2.
Se modifican las propiedades del objeto agregado, para que se comporte de la manera en que queremos. 9.2.1.
En Properties Window se localiza la propiedad a modificar.
9.2.2.
Editar el valor deseado en la columna de la derecha.
9.2.3.
Aceptar el dato modificado, presionando Intro.
10. Agregue el siguiente control: Objeto Label
Propiedad Text
Datatype String
Valor a asignar Nombre:
WBASP2010.02.04.wmv 11. Agregue el siguiente control, contiguo al objeto anterior: Objeto TextBox
Propiedad Width MaxLenght
Datatype Unit Int
Valor a asignar 350px 30
WBASP2010.02.05.wmv
www.Aprenda.mx – Knowledge Providers
15
Aprenda Workbook – Programación ASP.NET 2010
12. Agregue el siguiente control, contiguo al objeto anterior: Objeto RequiredFieldValidator
Propiedad ErrorMessage Text ControlToValidate Display
Datatype String String String ValidatorDisplay
Valor a asignar Nombre no debe omitirse * TextBox1 Dynamic
WBASP2010.02.06.wmv
13. Agregue el siguiente control en la siguiente línea de la interfaz. Colóquese después del último objeto y presione INTRO, para provocar el salto de línea. Luego agregue el siguiente Web Control: Objeto Button
Propiedad Text
Datatype String
Valor a asignar Aceptar
WBASP2010.02.07.wmv 14. Agregue el siguiente control, en la siguiente línea de donde acaba de agregar el control: Objeto Label
Propiedad Text
Datatype String
Valor a asignar <quite el valor>
WBASP2010.02.08.wmv La tabla de objetos y propiedades completa, quedaría como sigue: Objeto Label TextBox RequiredFieldValidator
Button Label
Propiedad Text Width MaxLenght ErrorMessage Text ControlToValidate Display Text Text
Datatype String Unit Int String String String ValidatorDisplay String String
Valor a asignar Nombre: 350px 30 Nombre no debe omitirse * TextBox1 Dynamic Aceptar <quite el valor>
TABLA DE OBJETOS Y PROPIEDADES. Este documento de trabajo permite especificar los objetos que integran una interfaz de usuario. Se debe especificar a) El tipo de objeto; b) el nombre de la propiedad que ha de especificarse de manera precisa; c) el tipo de dato que ha de asignarse a la propiedad; y d) el valor que debe asignarse. Si desea elaborar un documento de este tipo, busque el Template WB.TABLA DE OBJETOS Y PROPIEDADES.DOCX, en el CD complementario.
16
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
Agregando código a una página 15. A una página se le puede agregar código, a fin de lograr un comportamiento específico como respuesta a la interacción del usuario. Para agregar el código, basta hacer doble clic sobre el objeto al cual le queremos codificar un comportamiento. 15.1. Haga doble clic sobre el botón. 15.2. De forma automática se abre el Editor de código (Code Editor). 15.3. Por omisión, se generará el código del evento más común para el objeto seleccionado. Como podrá ver, se ha agregado un procedimiento para que codifique el evento Click del botón. Obviamente, hacer clic sobre un botón es lo más común. 15.4. Codifique lo siguiente, dentro del procedimiento que se ha agregado automáticamente.
Label2.Text = “Excelente”
WBASP2010.02.09.wmv 16. Vea cómo el espacio de trabajo lo comparten Web Forms Designer y Code Editor. 16.1. Puede alternar ente una y otra, haciendo clic en las pestañas superiores. 16.2. Si selecciona el archivo con extensión .vb, estará usando Code Editor, y si selecciona el archivo con extensión .ASPX, Web Forms Designer.
www.Aprenda.mx – Knowledge Providers
17
Aprenda Workbook – Programación ASP.NET 2010 Ejecutando la página 17. Guarde su trabajo, haciendo clic en el botón
(Save Web Form), o presionando CTRL+S.
17.1. Si en el proyecto desea guardar más de un archivo, presione CTRL+SHIFT+S.
(Save all), o presionando
18. Para ver en acción la página que acaba de desarrollar, puede hacer clic en el botón gging), o presionar F5. Con ello la página se cargará en el navegador.
(Start Debu-
19. Presione F5. 20. En ocasiones, el sistema enviará la siguiente pantalla, para confirmar que la máquina puede hacer depuraciones de programas. Si aparece, responda Ok.
21. Se abrirá el navegador, con la interfaz creada. 21.1. Haga clic en el botón Aceptar, y vea cómo se agrega un asterisco al lado del cuadro de texto, indicando que hay un error. 21.2. Escriba su nombre, y vuelva a hacer clic sobre el botón. 21.3. Como ya se cumple por verdadero la validación, entonces el código del botón se ejecuta, actualizando la etiqueta a la que le quitamos el valor, colocando el mensaje que le asignamos mediante programación. WBASP2010.02.10.wmv 21.4. Tómese el tiempo de analizar, tanto el código .ASPX, como el código .VB. 22. En Solution Explorer, haga clic en el nombre del programa que acaba de crear (Primera.aspx). 22.1. Invoque el menú de contexto presionando el botón derecho del ratón, y seleccione Delete. 22.2. Si aparece una ventana de conformación, seleccione Ok o Aceptar. 23. Le sonará extraña esta última acción: Vuelva a hacer todo, a partir del número 5. Haga el ejercicio, y bórrelo, y vuélvalo a hacer, y así, hasta que pueda hacerlo sin necesidad de ver el manual. A ese nivel de dominio de la herramienta quiere llegar ¿o no?... Entonces, hay que ser persistente. 23.1. Si al concluir este libro puede hacer todos los ejercicios contenidos, sin necesidad de ver el manual: ¡Felicidades!... Usted será muy competente, y nosotros tenemos un trabajo bien remunerado que ofrecerle: envíenos su resumen profesional a humanos@aprenda.mx, y díganos la frase “SOY EXPERTO EN ASP.NET 2010”, y nosotros lo pondremos en contacto con las empresas que requieren alguien como usted. 23.2. Si no puede hacer todos los ejercicios sin ver el manual, es necesario que se aplique más; no nos envíe nada: “LUEGO LE LLAMAMOS”
FIN DEL EJERCICIO
18
www.Aprenda.mx – Knowledge Providers
Módulo 2: Elementos de una página ASP.NET
Lab.02.02: Diagnóstico de elementos en una Página Web Le han pasado a usted el siguiente código, y le piden que lo analice: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <asp:TestBox ID="Domicilio" runat="server" TextMode="MultiLine" Rows="4" MaxLength="140" Width="350"> </asp:TextBox> <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ErrorMessage="El Domicilio no puede omitirse" ControlToValidate="Domicilio" Display="Dynamic" Text="*"> </asp:RequiredFieldValidator> <asp:Button ID="Button1" runat="server" Text="Aceptar" /> <a id="MiLiga" href="http://www.aprenda.mx" runat="server"> Ir al sitio Aprenda Practicando </a> </div> </form> </body>
1. Elabore un Dictamen escrito que contenga: Volumetría. Señale el número de veces que se encuentra cada uno de los elementos en este código: 1.1.
Directivas encontradas:
___________________________________
1.2.
Etiquetas HTML:
___________________________________
1.3.
Controles Web del Servidor (Web Controls):
___________________________________
1.4.
Controles de Validación (Validation Controls):
___________________________________
1.5.
Controles HTML del Servidor (HTML Controls):
___________________________________
1.6.
Propiedades de controles:
___________________________________
Hallazgos. El programa tiene 3 errores. Identifíquelos y documéntelos, señalando la línea en donde se tiene el error, las consecuencias de dicho error, y la recomendación de solución:
FIN DEL EJERCICIO
www.Aprenda.mx – Knowledge Providers
19
Aprenda Workbook – Programación ASP.NET 2010
EXAMEN RÁPIDO DEL MÓDULO Parte 1: Marque con una cruz el inciso que considere que responde a la pregunta. 1) Son los Controles Web que requieren de otros controles para poder funcionar. a) Controles Dependientes b) Controles de Validación c) Controles HTML 2) Son especificaciones de atributos que utilizará la página y los compiladores al procesar páginas Web en ASP.NET. a) Directivas b) Cookies c) Controles 3) Son implementaciones de funcionalidad basada en etiquetas, a través de los cuales se le ordena a la clase generada que construya contenido HTML dinámico, sensible a eventos, aplicable a un navegador dado. a) Código declarativo b) Directivas c) Controles del servidor 4) Su propósito es sólo generar una equivalencia estándar de código HTML, generado por el servidor. a) HTML Controls b) Web Controls c) Input Validation Controls 5) Es la capacidad de ASP.NET de manejar código en un archivo independiente. a) Separated Code b) Código Declarativo c) Code Behind Parte 2: Coloque en la línea la letra «F» si la sentencia es falsa, y «V» si la sentencia es verdadera.
20
_______
1.
_______
2.
_______
3.
_______
4.
_______
5.
Para que .NET Framework reconozca un control web, es necesario que posea la especificación runat=server. Si se coloca un Control Web fuera de un bloque <head> del servidor, o <form> del servidor, de todas maneras se ejecuta. En el ambiente gráfico de desarrollo de Microsoft, desde una misma herramienta (Visual Studio), es posible diseñar gráficamente una interfaz, y también codificarla. En el programa de código se especifica el lenguaje en el que ha de estar desarrollado el código, sea VB o C#. Dado que se ejecutan ambas en el servidor, son igualmente poderosos los Controles Web del Servidor, como los Controles HTML del Servidor.
www.Aprenda.mx – Knowledge Providers