Cuando alguien se interesa por el desarrollo web, desde dentro, los que ya nos dedicamos a esto pecamos de recomendar cursos, videos de YouTube y en definitiva contenidos que nosotros mismos consumimos para mantenernos al día. En algunos casos no entendemos de donde viene todo y confiamos en la mágia de que todo funciona y no nos cuestionamos por que o hace que quien se está iniciando no lo entienda, se frustre y lo deje.
La motivación detrás de este artículo es aclarar esta base a quien lo pueda necesitar.
- ¿Qué es el desarrollo web?
- La mágia de la web
- ¿Cómo se comunica el navegador y el servidor?
- ¿Cómo ha evolucionado el desarrollo web?
¿Qué es el desarrollo web?
Mediante los fundamentos del desarrollo web conseguimos crear sitios y aplicaciones web mediante la conexión de un usuario a través de una navegador con un servidor en internet, para que esta comunicación pueda llevarse a cabo nos servimos del protocolo HTTP/HTTPS y el lenguaje de marcado HTML para organizar la información.
Para enriquecer esta comunicación nos valemos de las hojas de estilo «CSS» que nos ayudan para dotar de identidad y dar valor a mensaje.
La mágia de la web
Cuando un usuario abre su navegador y escribe una URL, se envía una petición a través de nuesto ISP (Internet Service Provider) a los servidores DNS, que asocian los nombres de dominion como www.google.es con una dirección IP que identifica el servidor encargado de alojar la información que solicitamos.
Estos servidores en su respuesta nos envían información de todo tipo, HTML que puede interpretar nuestro navegador, images, videos. música…
¿Cómo se comunica el navegador y el servidor?
El cliente o navegador envía peticiones al servidor de diferentes tipo dependiendo de su proposito, en la imagen vemos algunos ejemplos como GET que es la solicitud más basica, POST que es la que usamos para adjuntar información en nuestra petición, PUT o DELETE que van más orientados a peticiones de modificación o borrado de datos en el servidor.
A estas peticiones que lanzamos desde el cliente el servidor nos responde, a parte de con el cuerpo del mensaje, con unas cabeceras que también aporta información valiosa sobre la petición, en la imagen vemos distintos estados y en http.cat podemos entrar en detalle sobre que significa cada uno asociado a imágenes de gatitos.
¿Cómo ha evolucionado el desarrollo web?
No he querido entrar en detalles de fechas, no quiero darmelas de historiador ahora y he preferido enfocar esta parte a visibilizar 3 eras en el desarrollo web que son las que yo he vivido como programador y son las que me han ayudado a entender como funciona todo a día de hoy.
En una primera etapa que he dominado «First ages», el desarrollador web escribía los archivos HTML que luego ponía tal cual en el servidor (mediate FTP) y este se los servía al cliente… Tras escribir estas lineas casi suelto una lagrimilla recordando programas como DreamWeaber de Adobe o el odiado Microsoft Frontpage.
Motivado por la necesidad de dinamizar la comunicación dimos paso a la segunda etapa, «Server ages«, aqui los desarrolladores ya usaban lenguajes de programación más espcíficos como PHP, Java, ASP… que colocaban directamente en el servidor y este se encargaba de procesarlos para enviar al cliente el esperados resultado HTML (con su CSS y JS básico, aquí he recordado esos scripts para hacer en nevase o que un reloj analógico siguese el cursos del usuario).
Hoy en día ha cambiado bastante la cosa, ahora vivimos en lo que he denominado «Node World«, se siguen usando lengiajes de servidor incluso más actuales como python pero son el menos de los casos, el mundo del desarrollo web, concretamente la parte frontal o front-end que es la que interactua directamente con el cliente, se sirve de JavaScript y su entorno de ejecución multiplataforma Node.js para servir al cliente el esperado HTML y CSS está vez con una versión optimizada de JS que dota nuestro sitio o aplicación web de una mayor reactividad y dinamismo.
Para esto el desarrollador se vale de frameworks como React, Angular, Vue… o metaframeworks como Next.js, sistemas de empaquetado como Webpack, Vite… que dan como resultado una primera versión de código para ser ejecutado en el servidor o directamente en el navegador del cliente.
Tanto si te estas iniciando en el desarrollo web como si venías buscando algo de información por curiosidad, gracias por llevar hasta aquí y espero que te haya sido de utilidad.
Todas las imágenes han sido creada con Excalidraw por mi.
