¿Que es ASP.NET?

ASP.NET es un framework para aplicaciones web desarrollado y comercializado por Microsoft. Es usado por programadores para construir sitios web dinámicos, aplicaciones web y servicios web XML.


Requisitos

Para desarrollar aplicaciones ASP.NET, se debe tener lo siguiente:

  • .NET Framework 2.0.
  • Un entorno de creación de código.
  • Un servidor Web como IIS (Servicios de Internet Information Server) y permisos para guardar archivos en el servidor Web.

Caso Práctico

Ahora les enseñare un pequeño ejemplo explicando paso a paso de como integrar una página HTML externa en ASP.NET.

En este caso yo usaré una plantilla HTML descargada de http://portnine.com/bootstrap-themes

Plantillas

Ahora abrimos nuestro Visual Studio, en mi caso usare la última versión, la 2012. Creamos una “Aplicación web vacia en ASP.NET“, tal como aparece en la captura.

Creación de proyecto

Después nos vamos al directorio de nuestra plantilla, seleccionamos las carpetas de los recursos (imagenes, css, etc..) y simplemente arrastrando, importamos en el proyecto ASP.

Recursos de página web

Recursos importados

Ahora viene lo mas interesante… Para llevar acabo el ejemplo, usaremos uno elemento llamado “Master Page” o “Página Maestra” que permiten definir el aspecto, el diseño y el comportamiento estándar que se desea que tengan todas las páginas (o un grupo de páginas) de la aplicación en una sola página maestra. Entonces, en nuestro caso, todos aquellos enlaces (CSS, imagenes, JavaScript, etc…), que se repitan en las páginas que vayamos a crear, importaremos en la página maestra y así evitando escribir el mismo código varias veces.

Una vez aclarado sobre “Master Pages”, continuamos con la integración. Lo que haremos, es agregar un nuevo elemento haciendo “click derecho” en el proyecto y después agregar la página maestra.

Agregar página maestra

En mi caso, la renombraré y llamaré como “global.Master”.

Después hacemos “click derecho” en “global.Master” y seleccionamos “Agregar página de contenido”.

Agregar página de contenido

También la renombraré y llamare como “login.aspx”, ya que en este caso sera una página de autentificación.

Renombrar página de contenido

Una vez tenemos todo lo comentado anteriormente hecho, pasaremos a importar el código HTML. Abrimos una de las página HTML de la plantilla y copiamos todo el contenido de las etiquetas “<head></head>”.

Seleccionar la cabezera

Seguido, vamos a la página maestra de nuestro proyecto y vemos una estructura similar a la de captura.

Código de página maestra

Ahora pegamos el código seleccionado entre las etiquetas “<head runat=”server”><head>”.

Pegar la cabezera

Ahora, volvemos otra ves al directorio de nuestra plantilla y escogemos la página que necesitemos, en este caso, como dije mas antes, sera la de “login”. Seleccionamos el código del cuerpo, es decir, todo el contenido  las etiquetas “<body></body>”

Seleccionar el cuerpo de la página

Y nos vamos al “login.aspx” de nuestro proyecto. Veremos otra estructura similar a la de captura.

Código de la página de contenido

Pegamos el código seleccionado entre las etiquetas “<asp:Content ID=”Content2″ ……. ></asp:Content>”. 

Pegar el cuerpo

Resultado final

Una vez hemos terminado lo explicado anteriormente, solo nos quedará ejecutar proyecto para ver el resultado final.

Prueba final


Despedida

Como hemos podido observar, con unos cuantos pasos simples, se puede integrar las páginas HTML sin ningún problema.

Espero que la explicación haya sido clara y entendible, ya que me acuerdo, que hace tiempo estaba con el mismo problema, buscando por la red horas y horas, pero no encontraba un articulo realmente completo que me pudiera explicar y resolver las dudas que tenia.

Tengo pensado escribir unos cuantos artículos más sobre ASP.NET, para explicar de como se puede conectar el HTML con los “WebForms”, interactuar entre ellos, etc…

Espero que les haya gustado, saludos.