Clase 01

¿Cómo funciona una
aplicación web?

Cliente · Servidor · HTTP

Programación Web

¿Qué pasa cuando hacemos click?

Hacemos estas acciones todos los días:

🌍 Abrimos una página web
🔎 Buscamos información
📃 Completamos un formulario
🔒 Iniciamos sesión

Detrás de cada acción hay una comunicación entre dos partes.

¿Cómo viaja esa información?

Modelo Cliente – Servidor

Cliente

Es quien inicia la acción. Generalmente es el navegador o una aplicación que solicita información.

Servidor

Es quien recibe el pedido, lo procesa y devuelve una respuesta con datos, páginas o recursos.

"El cliente pide, el servidor responde"

Ejemplo cotidiano

🍽️ Analogía del restaurante

Vos en la mesa: El cliente
La cocina: El servidor
El mozo: El medio que lleva y trae el pedido
En la web, HTTP cumple ese rol de comunicación entre cliente y servidor.
Cliente Servidor

Ejemplo cotidiano

La idea central no cambia:

1. El cliente solicita algo
2. El servidor procesa el pedido
3. El servidor devuelve una respuesta

Flujo de comunicación

Cliente

Navegador o app

→

Request

Pedido

→

Servidor

Procesa la solicitud

→

Response

Respuesta

→

Cliente

Muestra el resultado

Ejemplo de request

“Quiero ver la página de inicio”

Ejemplo de response

“Aquí tenés el HTML, el CSS y los datos necesarios”

Ejemplo real

fetch('https://jsonplaceholder.typicode.com/posts/1')
  .then(response => response.json())
  .then(data => console.log(data));
fetch() inicia la solicitud al servidor.
La URL indica a qué recurso queremos acceder.
json() interpreta los datos recibidos.
console.log(data) nos permite ver la respuesta.

HTTP y HTTPS

HTTP es el protocolo que permite la comunicación entre cliente y servidor.

GET Solicitar información
POST Enviar información

HTTP

Permite comunicar cliente y servidor.

HTTPS

Es la versión segura de HTTP, porque cifra la información.

01

Cliente

Solicita una acción o recurso.

02

Servidor

Procesa el pedido y genera la respuesta.

03

HTTP/HTTPS

Hacen posible esa comunicación.

“No es magia... es arquitectura”

No es magia...
es arquitectura

Programación Web

Muchas Gracias