Práctica 102. Introducción a las arquitecturas web.
Esta práctica se centra en comprender las diferencias entre la ejecución en cliente y en servidor, así como en experimentar con PHP como lenguaje de servidor, JavaScript en cliente y su integración en un flujo web moderno.
Ejercicio 1. Diferenciación de arquitecturas.
Realiza los siguientes pasos:
- Explica, en un diagrama, el recorrido de una petición HTTP desde que el usuario introduce una URL en el navegador hasta que recibe la respuesta.
- Señala dónde se ejecuta el código del cliente (HTML, CSS, JS) y dónde el del servidor (PHP).
- Crea un archivo
index.htmlcon un botón que al pulsarse ejecute unalert()de JavaScript. - Crea un archivo
server.phpque devuelva la fecha y hora del servidor. Accede a él desde el navegador. - Responde: ¿Qué diferencia observas entre ambos códigos? ¿Dónde se ejecutan?
Ejercicio 2. SSR (Server Side Rendering) o CSR (Client Side Rendering).
Realiza los siguientes pasos:
- Crea una página
dinamico.phpque muestre un saludo distinto según la hora del servidor (por ejemplo: "Buenos días", "Buenas tardes", "Buenas noches"). - Crea otra página
estatico.htmlcon unscriptque haga lo mismo, pero tomando la hora del sistema del cliente con JavaScript. - Compara ambos resultados en un informe: ¿qué ventajas y limitaciones tiene cada enfoque?
Ejercicio 3. Servidores web y de aplicaciones.
Realiza los siguientes pasos:
- Responde: ¿Qué es Apache? ¿Qué es NGINX? ¿Qué diferencia hay con Node.js como servidor de aplicaciones?
- Simula levantar un servidor PHP embebido con
php -S localhost:8000y describe cómo funciona.
Ejercicio 4. Comparación de lenguajes de programación para backend.
Haz una tabla comparando PHP, JavaScript (Node.js) y Python en:
- Adecuación para web
- Tipo de ejecución
- Portabilidad
- Casos de uso habituales
- Ventajas/inconvenientes
Ejercicio 5. Integración de lenguajes de marcas y servidor.
Realiza los siguientes pasos:
- Crea una página
productos.phpque genere dinámicamente una lista de productos en una tabla HTML a partir de un array en PHP. - Añade un pequeño script en JavaScript que permita resaltar la fila seleccionada al hacer clic.
- Responde: ¿Qué papel juega cada tecnología en la generación y manipulación de la página?
Ejercicio 6. Herramientas de programación en entorno servidor.
Realiza los siguientes pasos:
- Investiga y prueba brevemente una herramienta de desarrollo para PHP. Por ejemplo, XAMPP, Composer o un IDE como VSCode con extensiones para PHP.
- Realiza una captura de pantalla y escribe un párrafo sobre su utilidad.
- Realiza una tabla comparativa sobre las ventajas y desventajas de los siguientes stacks: LAMP, MEAN y JAM.
Ejercicio 7. Frameworks de PHP y JavaScript.
Busca en Internet cuáles son los tres frameworks PHP más utilizados, e indica:
- Nombre y URL
- Año de creación
- Última versión
- ¿Qué es lo que lo diferencia del resto?
Haz lo mismo para JavaScript (NodeJS). Solo busca frameworks para backend.