Experiencia de Usuario.

Personalmente considero que WebMatrix es una herramienta bastante completa que cuenta con varias opciones para los desarrolladores web, desde si no tienes tiempo para crear un sitio web y hacer uso de las plantillas que ofrece hasta poder hacer uso de su editor de cdigo que permite editar html, css, javascript, etc. Y tambin permite trabajar con bases de datos, guardar los sitios que hemos creado. Adems de eso hay que tener en cuenta que ya tiene integrado el servidor web que se va a utilizar facilitando la creacin de los sitios web.

Instalacin de WebMatrix
Microsoft WebMatrix es una herramienta libre que sirve para crear, mejorar y publicar sitios web en la Internet. Es decir, que WebMatrix facilita la creacin de los sitios web. Y podemos comenzar con aplicaciones de cdigo abierto como lo son Joomla, WordPress, etc. Y WebMatrix se encarga de descargar todo, instalarlo y configurar las aplicaciones en lugar de hacerlo nosotros. Tambin se puede escribir cdigo, aunque en realidad WebMatrix ofrece todo incluido el servidor web, base de datos y el framework. Lo descargaremos de: http://www.microsoft.com/web/webmatrix/

Figura 1. Pgina de descarga de WebMatrix 3 Preparndonos para la Instalacin

Figura 2.

Figura 3.

Figura 4. Damos clic en Instalar.

Figura 5. Nos indica cuales son los requisitos para poder hacer uso de la herramienta y damos clic en Acepto.

WebMatrix no solo es un editor sino que tambin integra un servidor web que es conocido como IIS Express. Un servidor web es un software que lo que hace es escuchar los pedidos de datos de Internet, y le responde entregndole datos al navegador web. Es decir que cada vez que accedemos a una direccin web o un enlace, la misma contesta enviando cdigo HTML, CSS, Javascript, las imgenes, etc. Luego el navegador lo ensambla todo en la pgina para que pueda ser visto.

Figura 6. Descargando las dependencias y WebMatrix.

Figura 7. Terminado de instalar lo necesario, lo configura y est listo para instalarse del todo.

Figura 8. Nos muestra las aplicaciones que ofrece Microsoft.

Figura 9. Muestra los productos que ofrece Microsoft.

Figura 10. Muestra las noticias destacadas dentro del desarrollo web en Microsoft.

Figura 11. Podemos ver que ya est instalado y lo seleccionamos.

Figura 12. Ventana de bienvenida. Las opciones que aparecen en la ventana de bienvenida son: Mis sitios: que si ya tenemos algn sitio construido con WebMatrix lo podemos ver desde ac.

Figura 13. Nuevo: que es para construir un nuevo sitio web, podemos hacer uso de una plantilla ya prediseada, de las aplicaciones o crear uno desde cero.

Figura 14.

Abrir: que es para abrir un archivo ya creado, puede ser un sitio ya hecho, hacer uso de Windows Azure, ver una carpeta, tener acceso remoto, etc.

Figura 15. Creando un sitio web con WebMatrix Seleccionamos la opcin de sitio vaco. Dentro de Nuevo. Esto para hacer un sitio web nosotros mismos. Aunque si accedamos a las plantillas de ejemplo saldra algo prediseado.

Figura 16. Editor de WebMatrix. En la parte izquierda en la esquina inferior podemos observar 4 mens o botones que son Sitio, Archivos, Bases de datos e Informes. Cambiemos el nombre del sitio web a Pelculas 2013 dando clic derecho donde dice EmptySite.

Figura 17. Damos clic en Archivos y vemos que en el centro nos aparece un botn que dice Crear un nuevo archivo.

Figura 18. Vemos lo que es la Direccin URL del sitio y la ruta de acceso desde nuestro equipo. Al tener al servidor corriendo en WebMatrix se hace bastante sencillo que podamos ir corriendo y viendo cmo va quedando el sitio web que estamos creando Nos vamos a archivos

Figura 19. Seleccionamos ya en Archivos el botn de en medio que dice Crear un Nuevo Archivo.

Figura 20. Muestra los tipos de archivos que presenta, que son html, css, javascript, etc. Seleccionaremos un html que le pondremos index.html

Figura 21. Seleccionamos HTML y le nombramos index.html y damos clic en Aceptar.

Figura 22. Nos muestra la misma venta del editor pero ahora con el cdigo html que se ve, ahora la editaremos para que se vea mejor.

Figura 23. Ahora el cdigo que se muestra tiene un ttulo, y su respectivo body. Para ver el resultado de lo codificado debemos de dar clic en el botn ejecutar.

Figura 24. Botn para ejecutar el cdigo html.

Figura 25. Ya ejecutado vemos el resultado obtenido del cdigo.

El Servidor Web Si nos fijamos en la direccin que aparece en el navegador: http://localhost:18606/index.html , podemos observar que no abri un archivo desde el disco duro, sino que lo corri desde el Web Server y pidi que se mostrara el archivo index.html.

Figura 26. Cuando le damos Ejecutar nos muestra varias opciones de navegadores, dado que no en todos los sitios web se ve igual, as que sirve para ir verificando como se ven.

Creacin de Sitio Web usando Plantillas de la galera

Figura 27. Creacin de sitio web haciendo uso de la Galera de aplicaciones.

Figura 28. De todas las opciones de plantillas seleccionaremos la de Sitio Personal y damos clic en siguiente.

Figura 29.

Figura 30.

Figura 31.Podemos observar en el lado izquierdo de la pantalla de todos los archivos de los que hace uso la plantilla.

Le damos clic en el botn de ejecutar que previamente visualizamos.

Figura 32. Visualizacin del sitio personal que seleccionamos antes. Y ah podemos ir modificando todo para crear un sitio web personalizado.

Bibliografa

Microsoft. Descargar WebMatrix[en lnea]. Microsoft, Descargas, 2013[Consulta: 09 de agosto del 2013]. Disponible en: http://www.microsoft.com/web/webmatrix/ Santimacnets Blog [en lnea]. Santimacnets Microsoft WebMatrix 2, 2013[Consulta: 10 de agosto del 2013]. Disponible en: http://santimacnet.wordpress.com/2011/11/10/microsoft-webmatrix-2/ Servigna Blogs. [En lnea]. Servigna Blogs.Qu es WebMatrix?, 2013[Consulta: 10 de agosto del 2013]. Disponible en: http://servigna.wordpress.com/2011/03/15/que-es-webmatrix/