Algunas de las otras respuestas han discutido tecnologías específicas, intentaré agregar una descripción más general.
La parte frontal de una página web, como mencionó, es la estructura de elementos (HTML), el estilo (CSS) y el comportamiento dinámico (JS) de la página, procesada y mostrada por el navegador.
En los “viejos tiempos” de Internet, la mayoría de las páginas web eran simplemente documentos html / css en servidores. Alguien ingresaría una URL en su navegador, se envió una solicitud a través de Internet para el recurso ubicado en esa URL, y el servidor web (probablemente Apache) recibiría la solicitud y luego enviaría el archivo de la página a través del Internet al usuario navegador, que representaría la página.
- ¿Cómo se conecta su aplicación React a un backend, por ejemplo: (Node + Express + Postgres)?
- ¿Qué pila es mejor para un ingeniero de software de SF que recién está comenzando, front-end JS o JS full-stack con Ruby back-end?
- Cómo manipular .htacess a través del código PHP
- Cómo comenzar a aprender GO Lang
- ¿Cómo vinculan los desarrolladores back-end su trabajo con los desarrolladores front-end?
Con el crecimiento de la web, el contenido dinámico se hizo rápidamente necesario. Por ejemplo, un sitio web de noticias con historias que cambian constantemente o algo con contenido generado por el usuario; actualizar el HTML a mano cada vez sería bastante difícil de manejar.
Entonces, tecnologías como PHP comenzaron a usarse en el lado del servidor. Típicamente, el servidor web tendría acceso a una base de datos que contiene toda la información relevante para un sitio: contenido (texto), usuarios, perfiles, etc., y plantillas HTML / CSS para las páginas principales del sitio.
La forma en que esto funciona es que ingrese una solicitud, se consultará la base de datos para recuperar la información necesaria para atender esa solicitud (la información de perfil de usuario, contenido, etc.) y luego el servidor insertará dinámicamente ese contenido como se indica en el modelo. El resultado sería un documento HTML / CSS como cualquier otro, compuesto “en el acto” en función de la solicitud.
Esto permitió una mayor complejidad en los sitios web y la reutilización de todos los elementos de las páginas web que no cambian (como encabezados, fondo, etc.), actualizando solo las partes dinámicas según sea necesario.
Todo esto se puede hacer hoy en Python (u otros lenguajes) de manera más elegante que en PHP, con la ayuda de uno de los excelentes marcos web de Python, como Flask, Django o Pyramid. Yo personalmente recomiendo Flask como una opción ideal para comenzar.
El frasco en sí consiste principalmente en una utilidad de “Interfaz de puerta de enlace de servidor web” (WSGI) (traducción: manejo de solicitudes) llamada Werkzeug y una herramienta de plantillas llamada Jinja. Ambos son muy fáciles de usar.
Flask facilita la escritura de plantillas que pueden representar documentos HTML dinámicamente, en función de los datos que les proporciona, y también asigna URLS a funciones de Python que:
– use el código Python para procesar solicitudes
– prepare los datos que desea pasar a una plantilla elegida
– renderizar y devolver documentos HTML con estilo basados en plantillas
Recientemente, el uso de frameworks front-end también es muy popular: esto implica tomar los elementos que acabo de describir (manejo de solicitudes y representación HTML) y manejarlos en el lado del cliente en lugar del servidor, ahorrando el viaje de ida y vuelta al servidor para la mayoría de las acciones . El uso de esta arquitectura para un sitio completo se conoce como una “aplicación de página única”, ya que la página solo se carga desde el servidor una vez (cuando el navegador descarga el código Javascript que hace todo lo demás). Después de la descarga inicial, la única comunicación con el servidor es a través de llamadas API para recuperar datos en bruto o guardar cosas en la base de datos, que es más ligera en el servidor en comparación con el envío de páginas completas cada vez, y permite un mejor rendimiento en el lado del cliente .
Se pueden combinar fácilmente estos enfoques mediante el uso de plantillas HTML para representar las páginas en el servidor, pero con algunos elementos de página dinámicos administrados por JavaScript en el lado del cliente.
En cualquier caso, el paradigma es el mismo: usar código para crear HTML / CSS dinámicamente y administrar ese proceso y las preocupaciones que lo rodean (como autenticación, control de acceso, etc.) de la manera más conveniente posible.
Entonces, en lo que respecta a conectar los dos, se trata de crear los documentos HTML en el servidor y luego enviarlos al cliente, o habilitar el acceso a datos sin procesar del cliente (a través de llamadas API desde el código javascript) y renderizar en el cliente lado.
¡Espero que este resumen ayude!