Cuando tu app necesita un dato que no vive en el navegador, alguien tiene que ir al servidor, preguntarlo y traerlo de vuelta. Ese mecanismo de ida y vuelta entre cliente y servidor se llama API, y es el contrato que hace posible que dos sistemas se hablen sin malentendidos. Si estás aprendiendo desarrollo web, entender cómo funciona una API y cómo se lee una respuesta en JSON es lo que conecta todo lo que ya viste sobre dónde corre el código y dónde viven los datos.
¿Qué es una API en desarrollo web?
Una API es un acuerdo entre dos sistemas. La sigla viene de Application Programming Interface, pero lo importante no es el nombre, sino la idea: el servidor publica un contrato que dice si me pides esto de esta forma, yo te respondo con esto otro, y el cliente lo cumple.
Imagina que Okini, una cafetería de especialidad, tuviera una API real. Esa API tendría una lista de preguntas que cualquier cliente puede hacer, cada una en una dirección parecida a una URL:
- ¿Cuántas tazas de B60 quedan disponibles hoy?.
- ¿Hay cupos en la cata del sábado?.
- ¿A qué hora está abierto Okini hoy?.
El cliente envía la pregunta, el servidor consulta su base de datos, cuenta reservas y devuelve la respuesta. Ese viaje pasa miles de veces al día en cualquier app que uses.
¿Qué es una API en palabras simples? Es un contrato entre dos sistemas que define qué puedes preguntarle a un servidor y en qué formato te va a responder. El cliente pide, el servidor responde, la información viaja en los dos sentidos.
¿Por qué las respuestas vienen en formato JSON?
Las respuestas no llegan en español ni en cualquier formato libre. Llegan en JSON, un formato pensado para que humanos y máquinas lo lean sin ambigüedad. Una respuesta de la API hipotética de Okini se vería con tres líneas: el nombre del método, cuántas tazas quedan y el precio. Cada dato tiene una etiqueta entre comillas, dos puntos y un valor.
Y si lo miras con atención, se parece mucho a las variables de JavaScript. No es coincidencia: JSON está basado en la sintaxis de objetos de JavaScript, así que si entiendes uno, entiendes el otro casi sin esfuerzo extra.
¿Dónde aparece JSON en la vida real?
JSON está en muchísimos más lugares de los que imaginas. Es el lenguaje común con el que los sistemas modernos se hablan entre sí.
- Cuando una página guarda tu sesión, la guarda en JSON.
- Cuando un servidor le responde a otro, le responde en JSON.
- Cuando le pides algo a Claude o a la API de OpenAI, la respuesta llega en JSON.
Aprender a leer JSON es aprender a leer datos estructurados, y datos estructurados es lo que viaja entre sistemas todo el tiempo [05:10].
¿Cómo hace el cliente para pedirle datos al servidor?
Desde JavaScript existe una herramienta que se llama fetch, y es básicamente la forma de decir ve a esta dirección, hazle esta pregunta al servidor que está allá y tráeme lo que responda. Cuando la inteligencia artificial te genere código que consulta una API, fetch es lo que vas a ver, y ahora sabes que detrás hay un cliente pidiéndole algo a un servidor.
¿Cómo probar una API real desde la consola del navegador?
Vamos a verlo funcionando con la API pública de Open-Meteo, que reporta el clima en tiempo real. Para hacer la prueba bien, necesitas un detalle importante: ábrelo desde una página web normal, no desde una pestaña vacía, porque las pestañas vacías tienen restricciones de seguridad que bloquean este tipo de pruebas.
- Abre cualquier página web en tu navegador.
- Abre la consola en las DevTools, la misma que viste en la clase 17.
- Pega el fetch que aparece en los recursos de la clase apuntando a la API de Open-Meteo para Bogotá.
- Si la consola no te deja pegar, escribe primero
allow pasting y dale enter.
La respuesta que devuelve es un objeto JSON con datos del clima de Bogotá: temperatura actual en grados Celsius, velocidad del viento en kilómetros por hora, dirección del viento y elevación de la ciudad. Si repites la petición en una hora, los números cambian, porque el servidor reporta lo que está pasando en tiempo real [06:30].
¿Qué es fetch en JavaScript? Es una función que envía una petición a una URL y trae de vuelta la respuesta del servidor. Es la forma estándar de consumir APIs desde el navegador.
¿Qué tienen que ver las APIs con la inteligencia artificial?
Las herramientas que has estado usando, Claude, ChatGPT, Gemini, todas se consumen a través de APIs. Cuando una aplicación usa IA por dentro, lo que pasa técnicamente es esto: la aplicación envía tu prompt como parte de una petición a la API del modelo, y el servidor devuelve la respuesta en formato JSON. Esa respuesta la app la procesa y te la muestra como texto bonito, pero por debajo es JSON viajando por Internet.
Esto cambia cómo ves las herramientas de IA. No son un mundo aparte: son un caso particular de cliente, servidor, API y JSON [07:45].
¿Qué cierra este mapa de cliente y servidor?
El módulo abrió con una pregunta: dónde vive lo que construyes. La respuesta tiene cuatro capas que ahora puedes nombrar.
- Vive en una conversación entre dos computadores que se reconocen por nombre y dirección.
- El código corre en dos lugares con responsabilidades distintas.
- Los datos pueden vivir en tres sitios según lo que necesiten.
- Los sistemas se hablan a través de contratos que llamamos APIs.
Lo que sigue es llevar lo que construiste al mundo real: subir tu código a Internet, publicarlo en una URL y cerrar el círculo completo.
El reto de Useless Facts
Si llegaste hasta acá, te felicito. Como recompensa hay un chiste interno entre quienes terminan este módulo: existe una API pública llamada Useless Facts cuyo único propósito es devolver datos completamente inútiles. Hazle un fetch desde la consola igual que con la del clima, pero cambiando la URL por la que te dejo en los recursos. Deja tu respuesta en los comentarios y conviértete en parte de la primera comunidad de programadores con conocimientos perfectamente inútiles. ¿Qué dato absurdo te tocó?
