python

Reutilizar plantillas en Flask con Jinja

En este post sobre Flask te mostraré cómo definir una plantilla base o plantilla maestra y después solo sobrescribir  el contenido y ciertos bloques, de modo que puedas definir y reutilizar una plantilla, evitando repetir código.

Para ello vamos a usar el template engine que Flask usa por defecto y que nos viene de maravilla: Jinja.

Definiendo plantilla base

Primero vamos a definir nuestra plantilla. Normalmente solo necesitaremos definir dos bloques: el bloque de contenido y el bloque de título, ya que lo demás (head, footer, etcétera) se repite a lo largo de todas las plantillas.

Sin embargo esto solo es un ejemplo, tú puedes definir tus bloques a tu gusto.

See the gist on github.

Sin importar el framework o los elementos que uses, fíjate en dos cosas. Primero, en la etiqueta title estoy definiendo el bloque llamado titulo, en este caso cuando se remplace dirá algo como CRUD MySQL con Flask - [Aquí el título que hayan colocado].

Después, en la línea 43 estoy definiendo todo el bloque de contenido. Ahora solo resta extender de esa plantilla.

Extendiendo de plantilla base en Flask

Ahora debemos definir otra plantilla en donde extendemos de la definida anteriormente. Para ello usamos extends.

Por cierto, también sobrescribimos los bloques usando block. De modo que el código queda así:

See the gist on github.

Ahora el contenido solo es todo lo que está en section, que es algo de relleno; pero lo que realmente importa es que estamos extendiendo de nuestra plantilla base o plantilla maestra.

Resultados

Reutilizar plantillas en Flask con Jinja – Plantilla base

Al renderizar la plantilla con render_template:

See the gist on github.

El HTML generado es el siguiente:

See the gist on github.

Si te fijas, viene todo el head, el nav, etcétera que definimos anteriormente en nuestra plantilla base, pero ahora solo estamos reutilizando así que queda un código más limpio a nivel de plantilla.

Te invito a leer más sobre Flask y Python aquí.

Encantado de ayudarte


Estoy disponible para trabajar en tu proyecto, modificar el programa del post o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.

No te pierdas ninguno de mis posts

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.
parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

Entradas recientes

Imprimir PDF con Bot de Telegram

La impresión de un PDF en cualquier impresora se puede automatizar con un bot de…

3 días hace

Enviar mensaje con bot de Telegram usando JavaScript (lado del cliente)

Hoy te enseñaré cómo enviar un mensaje a un usuario desde un bot de Telegram…

3 días hace

PHP: incrustar imagen en base64

El día de hoy te enseñaré algo muy sencillo pero útil al programar con PHP:…

3 días hace

Plugin ESC POS – Actualización 3.4.0: imprimir HTML

El plugin para imprimir en impresoras térmicas alcanza hoy su versión 3.4.0 agregando soporte para…

4 días hace

JavaScript (lado del cliente): leer pixeles de imagen

En ocasiones es necesario leer los pixeles y colores de una imagen con JavaScript del…

2 semanas hace

PHP y JavaScript: llenar select con AJAX

Siguiendo con los tutoriales de listas desplegables o select con JavaScript, vamos a ver cómo…

2 semanas hace

Esta web usa cookies.