Introducción al Proyecto Paul Leger http://pleger.cl
Sitio Web Datos (ej. 36) Página estática HTML (ej. Index.html) Servidor Web Servidor de base de datos HTML (ej. Index.html) PC cliente Este servidor puede tener páginas estáticas o dinamicas Las páginas dinámicas son programas, cuyas son salidas son códigos HTML. Por ejemplo, sería un programa un python que cuyas “prints” son códigos HTML
CÓDIGO HTML
Código Python para generar HTML print “ <html> <head> <title> Un titulo</title> </head> <body> <h1> Titulo </h1> <p> Este es un parrafo </p> </body> </html>” Esto es solo un ejemplo de como funcionaría una página dinamica. Actualmente, hay lenguajes espciales (ej. PHP) o framework de algún lenguaje conocido (ej. Djando de Python) Las páginas dinamicas se ejecutan en el serivdor y el resultado de la ejecución es enviado al cliente.
Proyecto Se usará HTML para generar el contorno del sitio/página Web Se usará el lenguaje PHP para conectarse con la base de datos MySQL. PHP es un lenguaje similar a Python, pero mucho más parecido a Java/C
Transfiriendo archivos desde su host al servidor WinSCP (http://winscp.net/eng/download.php) es un programa de windows para transferir archivos desde un sistema operativo Windows a un sistema operativo basados en Unix Para usar este programa, usted debe considerar que el servidor contenga las siguientes carácteristicas: El sistema operativo (SO) basado en Unix El servicio SSH este “arriba” y conocer el puerto de este servicio (generalmente es el 22) Conocer la IP del servidor Un usuario y password conocido del sistema operativo
Ejemplo HTML/PHP en Koding
Ejemplo HTML en Koding
Ejemplo PHP en Koding
Editores de Texto Ustedes pueden usar diferentes: vim (linea de comando) Koding editor (interfaz Web) Usar editor de Windows y luego transferir el archivo (ej. Usando WinScP)
Ayudando la construcción del Sitio Web Actualmente, hay muchas herramientas que faciltan la vida a los programadores de sitios Web Dreamweaver (creando páginas sin programar) DokuWiki (crea un sitio Web básico configurable) Wordpress (crea un sitio Web un poco más avanzado configurable). Este último es muy usado. Wordpress necesita una base de datos. El sitio http://pleger.cl está implementado en Wordpress. Opciones 2 y 3 pueden ser útil para mejorar la apariencia de un sitio Web, pero puede ser complejo para programar un PHP que se conecte a una base de datos
Ejemplo de DokuWiki
Ejemplo de Wordpress
Ejercicio: Creando una página Web Usted debe crear una página Web en su cuenta de Koding que muestre una imagen. Para lograr esto, usted debe: Ir a la carpeta “/var/www” Crear un archivo de nombre “mypage.html” y edite el archivo para crear un archivo valido de página Web (mirar ejemplos anteriores). Además, este archivo debe mostrar una imagen. Aquí se escribe un código HTML para ayudarlos: <img src="http://[IP-PUBLICA-KODING]/[NOMBRE-ARCHIVO]"> Para mostrar una imagen, usted debe mover esta imagen al servidor. Para esto, usted puede usar WinScp (explicado en slides anteriores) NOTA: En la Web, hay muchos editores Web que pueden ayudarles. Incluso hay algunos editores online: http://www.quackit.com/html/online-html-editor/