HTML y CSS

Anteriormente, para obtener la información en los sitios web, se tenía un servidor que exponía todas la páginas disponibles, desde el browser se consumía una ruta a ese servidor y desde el servidor se descargaba en el browser, ahí ya se podía hacer con la información lo que uno quisiera.

El servidor es una máquina potente o servidores en la nube (Amazon Web Services).

Se tiene la URL en el servidor local (google.com/), luego se transmite por medio del DNS (Dominio servidor de nombre), hacia una IP y finalmente al servidor (donde se aloja la app). El DNS tiene mapeado el dominio de las páginas, lo direcciona a la IP. Con la IP, el internet sabe a dónde redirigir la petición, hacia el servidor. Esta comunicación se realiza a través de un protocolo llamado HTTP, creado para transferir data a través de la web.

Mediante el protocolo de comunicación, el servidor lee la petición, y según la ruta inicial (google.com/), el servidor determina un tipo de HTML con la data, siendo estos dos últimos transferidos al servidor local y mostrados en pantalla. Para crear el HTML con la data y ser mostrada, el servidor debe conectarse con la BD y hacer procesamientos internos para modificar la data. Finalmente, se descarga el archivo con la data y se muestra en la web.

Los navegadores solo entiende 3 tecnologías: 

• HTML (estructural)
• CSS (interfaz visual)
• Javascript (interacción con el usuario en el sitio web)

Con el uso prolongado de los dispositivos móviles y para evitar costos de mantenimiento/mejoramiento de los servidores o BD, se empezaron a idear nuevas formas de cambiar la arquitectura en la web. Se quitó parte del proceso en el servidor. La creación del archivo descargable en el servidor se podía dejar de hacer y podría ejecutarse directamente en el dispositivo del cliente. Así, surgen las SPA (single page application), que consiste en una app que se despliega en un dispositivo y se renderiza o se crea en una única página, es decir, solo habrá un archivo HTML y dependiendo de las rutas en las que se navegue, el mismo archivo HTML cambiará su contenido. Por lo general, ese archivo es llamado "index.html" y es allí donde se cambian los elementos dinámicamente mediante el DOM (Document Object Model).

Estas páginas deben estar soportadas por un servidor, pues se quiere mostrar la data, pero, aunque se esté del lado del cliente, esa data no está en las aplicaciones cliente. Dichas son aquellas que renderizan la información que se encuentra en el servidor, pero la data no se encuentra ahí, está en el servidor.

En este caso, la comunicación se da por medio de las APIs (Application Programming Interface), donde se especifican los servicios disponibles para que consuman los clientes. Los servicios van a responder según lo que el servidor resuelva. Sigue siendo a través del protocolo HTTP.

Surge una arquitectura llamada "REST", donde se hace la petición al servicio, el servidor sigue haciendo el procesamiento del servicio a la vez que consume de la base de datos, pero ahora, el servidor no creará un documento HTML, sino que responderá la petición con la data que está pidiendo a través del protocolo HTTP y la información se comparte usando un formato JSON tanto la información que se consulta como la que se retorna. Se descarga la data en el formato JSON y la aplicación obtendrá esa información y cambiará lo necesario para mostrarlo.

Los frameworks que modifican la data en la app pueden ser: React, Angular, Vue ...