How-To's Web Development

La guía definitiva de las plantillas de Django

Read this post in other languages:

Las plantillas de Django son una parte crucial del marco de trabajo. Entender qué son y por qué son útiles puede ayudarle a construir plantillas fluidas, adaptables y funcionales para sus webs y aplicaciones Django.

Si es nuevo en el marco de trabajo y va a configurar su primer proyecto Django, es esencial que comprenda las plantillas. En esta guía, encontrará todo lo que tiene que conocer sobre las plantillas de Django, incluidos los diferentes tipos y cómo utilizarlos.

¿Qué son las plantillas de Django?

Las plantillas de Django son una parte fundamental del marco de trabajo Django. Le permiten separar la presentación visual de su sitio web del código subyacente. Una plantilla contiene las partes estáticas del resultado HTML que desea y una sintaxis especial que describe cómo se insertará el contenido dinámico.

En última instancia, las plantillas pueden generar páginas web completas, mientras que las consultas a la base de datos y otras tareas de procesamiento de datos son gestionadas por vistas y modelos. Esta separación asegura un código limpio y fácil de mantener, puesto que conserva la lógica empresarial HTML separada del código Python en el resto de su proyecto Django. Sin plantillas, tendría que incrustar HTML directamente en su código Python, lo que dificultaría su lectura y depuración.

Este es un ejemplo de plantilla Django que contiene algo de HTML, una variable name y lógica if/else básica:

Welcome!



{% if name %}

Hello, {{ name }}!

{% else %}

Hello, Guest!

{% endif %}

{{ heading }}

 

Ventajas de utilizar plantillas

Los desarrolladores utilizan plantillas de Django para crear aplicaciones fiables de forma rápida y eficiente. Otras ventajas clave de las plantillas son:

  • Reutilización del código: se pueden crear componentes y diseños reutilizables para mantener la coherencia entre páginas y aplicaciones.
  • Mantenimiento más sencillo: la apariencia de las páginas web puede modificarse sin alterar la lógica subyacente.
  • Mejora de la legibilidad: el código HTML puede mantenerse limpio y comprensible sin necesidad de una lógica compleja.
  • Herencia de plantillas: se pueden definir estructuras y diseños comunes para reducir la duplicación y promover la coherencia.
  • Contenido dinámico: se pueden crear páginas web personalizadas que se adapten a las entradas de los usuarios y a las variaciones de los datos.
  • Optimización del rendimiento: las plantillas pueden almacenarse en caché para mejorar el rendimiento de la aplicación o del sitio web.

Retos y limitaciones

Aunque las plantillas son esenciales para renderizar páginas web en Django, deben utilizarse con cuidado, especialmente en proyectos complejos con conjuntos de datos más grandes. A pesar de la relativa simplicidad del lenguaje de plantillas de Django, las plantillas demasiado complejas con numerosas etiquetas anidadas, filtros y herencia pueden llegar a ser difíciles de gestionar y mantener. En lugar de introducir demasiada lógica en sus plantillas, intente que se centren en la presentación. Las opciones de personalización también son limitadas, a menos que cree sus propias etiquetas o filtros personalizados.

Migrar a un motor de plantillas diferente puede ser un reto, ya que el motor predeterminado de Django está estrechamente ligado al marco de trabajo. Sin embargo, cambiar a una alternativa como Jinja es relativamente sencillo, y trataremos esta posibilidad más adelante en esta guía.

Depuración de plantillas de Django

En algunas situaciones (como cuando surgen problemas), puede ser útil ver cómo funciona su plantilla. Para ello, puede utilizar la depuración de plantillas.

La depuración de plantillas se centra en identificar errores en la forma en que interactúan su HTML y los datos dinámicos. Entre los problemas más comunes se incluyen variables que faltan, etiquetas de plantilla incorrectas y errores de lógica.

Por suerte, Django proporciona herramientas útiles como {{ debug }} para inspeccionar sus plantillas y páginas de error detalladas que resaltan dónde está el problema. Esto facilita la localización y resolución de problemas, para garantizar que sus plantillas se renderizan como se espera.

Comprender el lenguaje de plantillas de Django (Django Template Language, DTL)

El DTL es el motor de plantillas integrado de Django, diseñado para simplificar la creación de páginas web dinámicas. Combina a la perfección HTML con etiquetas y filtros específicos de Django, para que pueda generar contenidos ricos y basados en datos directamente desde su aplicación Django. Exploremos algunas de las características clave que hacen de DTL una potente herramienta para crear plantillas.

Sintaxis y estructura básicas del DTL

Las plantillas de Django se escriben con una combinación de sintaxis DTL y HTML. La estructura básica de una plantilla Django consiste en marcado HTML con etiquetas y variables Django integradas.

Aquí vemos un ejemplo:

  
    

{{ heading }}

    {% for item in item_list %}
  • {{ item.name }}
  • {% endfor %}
  

Variables, filtros y etiquetas

El DTL dispone de varias funciones para trabajar con variables, filtros y etiquetas:

  • Variables: las variables muestran datos dinámicos en las plantillas. Se encierran entre llaves dobles, por ejemplo {{ variable_name }}.
  • Filtros: los filtros modifican o formatean el valor de una variable antes de renderizarla. Se aplican utilizando una barra vertical ( | ), por ejemplo, {{ variable_name|upper }}.
  • Etiquetas: las etiquetas controlan la lógica y el flujo de las plantillas. Aparecen entre bloques {% %} y pueden realizar diversas operaciones como bucles, condicionales e inclusiones de plantillas.

PyCharm, un IDE profesional para el desarrollo en Django, simplifica el trabajo con plantillas de Django proporcionando resaltado de sintaxis, que codifica por colores etiquetas, variables y HTML para una mejor legibilidad. También ofrece detección de errores en tiempo real, lo que garantiza que no se le escapen etiquetas de cierre ni se equivoque en la sintaxis. Con el autocompletado de variables y etiquetas, codificará más rápido y con menos errores.

Herencia de plantillas y ampliación de plantillas base

El sistema de herencia de plantillas del marco de trabajo le permite crear una plantilla base que contiene la estructura estándar y el diseño de su sitio web o aplicación.

A continuación, puede crear plantillas secundarias que hereden de la plantilla base y anulen bloques específicos de secciones según sea necesario. Esto fomenta la reutilización del código y la coherencia entre sus diferentes plantillas.

Para crear una plantilla base, defina bloques utilizando la etiqueta {% block %}:




  
    
  
  
    {% block content %}
    {% endblock %}
  

A continuación, las plantillas secundarias amplían las plantillas base y anulan determinados bloques:


{% extends 'base.html' %}

{% block title %}My Page Title{% endblock %}

{% block content %}

My Page Content

  
This is the content of my page.
{% endblock %}

Etiquetas de plantilla Django

Las etiquetas son un elemento esencial de las plantillas de Django. Proporcionan diversas funcionalidades, desde el renderizado condicional y la creación de bucles hasta la herencia e inclusión de plantillas.

Explorémoslas con más detalle.

Etiquetas habituales de las plantillas de Django

Hay varias etiquetas de plantilla en Django, pero estas son las que probablemente utilizará con más frecuencia:

  • {% if %}: esta etiqueta le permite renderizar condicionalmente el contenido basándose en una condición específica. Se utiliza a menudo con las etiquetas {% else %} y {% elif %}.
  • {% for %}: la etiqueta {% for %} se utiliza para iterar sobre una secuencia, como una lista o un conjunto de consultas, y mostrar el contenido de cada elemento de la secuencia.
  • {% include %}: esta etiqueta le permite incluir el contenido de otro archivo de plantilla dentro de la plantilla actual. Facilita la reutilización de fragmentos de plantilla comunes en varias plantillas.
  • {% block %}: la etiqueta {% block %} se utiliza junto con la herencia de plantillas. Define un bloque de contenido que puede ser anulado por las plantillas secundarias al ampliar una plantilla base.
  • {% extends %}: esta etiqueta especifica la plantilla base de la plantilla actual desde la que debe heredar.
  • {% url %}: esta etiqueta se utiliza para generar una URL para un patrón de URL con nombre en su proyecto Django. Ayuda a mantener sus plantillas desacopladas de las rutas URL reales.
  • {% load %}: la etiqueta {% load %} se utiliza para cargar etiquetas y filtros de plantilla personalizados desde un módulo o biblioteca de Python, lo que le permite ampliar la funcionalidad del sistema de plantillas de Django.

Estos son solo algunos ejemplos de las muchas etiquetas de plantilla disponibles en Django. Etiquetas como {% with %}, {% cycle %} o {% comment %}, entre otras, pueden proporcionar funcionalidades adicionales para proyectos avanzados, y le ayudarán a crear aplicaciones personalizadas y eficientes.

Uso de etiquetas de plantilla

Aquí tiene un ejemplo detallado de cómo puede utilizar las etiquetas en una plantilla Django:

{% extends 'base.html' %}
{% load custom_filters %}

{% block content %}

{{ page_title }}

  {% if object_list %}
    {% for obj in object_list %}
  • {{ obj.name|truncate:25 }}
  • {% endfor %}
  {% else %}
    
No objects found.
  {% endif %}

  {% include 'partials/pagination.html' %}
{% endblock %}

En este ejemplo, ampliamos una plantilla base, cargamos filtros personalizados y, a continuación, definimos un bloque para el contenido principal.

Dentro del bloque, comprobamos si existe una object_list y, en caso afirmativo, la recorremos en bucle y mostramos los nombres truncados de cada objeto. Mostramos un mensaje «No objects found» si la lista está vacía.

Por último, incluimos una plantilla parcial para la paginación. Esta plantilla es un fragmento reutilizable de HTML que se puede incluir en otras plantillas, lo que le permitirá gestionar y actualizar elementos comunes (como la paginación) de forma más eficaz.

Plantillas de administración de Django

La interfaz de administración integrada de Django le ofrece una forma fácil e intuitiva de gestionar los datos de su aplicación. Se nutre de un conjunto de plantillas que definen su estructura, diseño y apariencia.

Funcionalidad

Las plantillas de administración de Django se encargan de varias tareas:

  • Autenticación: controla la autenticación, el inicio y el cierre de sesión de los usuarios.
  • Gestión de modelos: muestra listas de instancias de modelos y crea, edita y elimina instancias según sea necesario.
  • Renderizado de formularios: renderiza formularios para crear y editar instancias del modelo.
  • Navegación: renderiza la estructura de navegación de la interfaz de administración, incluidos el menú principal y los submenús específicos de la aplicación.
  • Paginación: renderiza los controles de paginación cuando se muestran listas de instancias del modelo.
  • Seguimiento del historial: muestra y gestiona el historial de cambios de las instancias del modelo.

Las plantillas de administración integradas de Django son una base sólida para gestionar los datos de su aplicación.

Personalización de las plantillas de administración

Aunque las plantillas de administración de Django ofrecen una interfaz buena y funcional desde el momento de su instalación, puede que desee personalizar su apariencia o comportamiento para adaptarse a las necesidades específicas de su proyecto.

Puede efectuar cambios para adaptarlas a la marca de su proyecto, mejorar la experiencia del usuario o añadir funcionalidades personalizadas exclusivas de su aplicación.

Hay varias formas de hacerlo:

  • Ignorar plantillas: puede ignorar las plantillas de administración predeterminadas creando plantillas con la misma estructura de archivos y convención de nomenclatura en el directorio de plantillas de su proyecto. Django utilizará así de forma automática sus plantillas personalizadas en lugar de las integradas.
  • Extender plantillas base: muchas de las plantillas de administración de Django se crean utilizando la herencia de plantillas. Puede crear plantillas que amplíen las plantillas de administración base y anulen bloques o secciones específicos.
  • Opciones de plantilla: Django dispone de varias opciones de plantilla que le permiten personalizar el comportamiento de la interfaz de administración. Esto incluye mostrar determinados campos, especificar cuáles deben ser editables y definir plantillas personalizadas para campos de modelo específicos.
  • Personalización del sitio de administración: puede personalizar la apariencia y el comportamiento del sitio de administración subclasificando la clase AdminSite y registrando su sitio de administración personalizado con Django.

Plantillas URL en Django

Las plantillas URL en Django ofrecen una forma flexible de definir y generar URL para aplicaciones web.

Comprender las plantillas de URL

En Django, los patrones de URL se definen en el archivo urls.py del proyecto utilizando la función «path» del módulo django.urls.

Estos patrones de URL asignan determinados patrones de URL a funciones Python (vistas) que gestionan las solicitudes HTTP correspondientes.

Este es un ejemplo de un patrón de URL básico en Django:

# urls.py
from django.urls import path
from . import views

urlpatterns = [
    path('', views.home, name='home'),
    path('about/', views.about, name='about'),
]

En este ejemplo, el patrón de URL ‘ ‘ se asigna a la función de vista views.home, y el patrón de URL 'about/' se asigna a la función de vista views.about.

Generación dinámica de URL con plantillas de URL

Las plantillas URL en Django le permiten incluir variables o parámetros en sus patrones URL. Esto significa que puede crear URL dinámicas que representen diferentes instancias del mismo recurso o incluyan más datos.

Si su archivo urls.py incluye otros archivos URL utilizando include(), PyCharm recoge y reconoce automáticamente todas las rutas anidadas, lo que garantiza que las sugerencias de nombres de URL sigan siendo precisas. También puede navegar hasta las definiciones de URL pulsando Ctrl y haciendo clic al mismo tiempo en el nombre de una URL para saltar directamente a su fuente, incluso si la URL está definida en un archivo secundario.

Veamos un ejemplo de plantilla de URL con una variable:

# urls.py
urlpatterns = [
    path('blog//', views.year_archive, name='blog_year_archive'),
]

En este caso, la URL 'blog//' incluye una variable «year» de tipo int. Cuando una solicitud coincida con este patrón, Django pasará el valor de «year» como argumento a la función de la vista views.year_archive.

Uso de las URL de Django

Las URL de Django son la base de cualquier aplicación y funcionan vinculando las solicitudes de los usuarios a las vistas apropiadas. Al definir patrones de URL adaptados a vistas específicas, Django garantiza que su sitio permanezca organizado y escalable.

Uso de plantillas de URL con la función reverse de Django

La función reverse de Django le permite generar URL basadas en sus patrones de URL con nombre. Toma como primer argumento el nombre del patrón de URL antes de cualquier otro argumento necesario, y devuelve la URL correspondiente.

Veamos un ejemplo concreto:

# views.py
from django.shortcuts import render
from django.urls import reverse

def blog_post_detail(request, year, month, slug):
    # ...
    url = reverse('blog_post_detail', args=[year, month, slug])
    return render(request, 'blog/post_detail.html', {'url': url})

La función inversa se utiliza para generar la URL del patrón de URL 'blog_post_detail', pasando los valores de año, mes y slug como argumentos.

A continuación, puede utilizar la URL devuelta en plantillas u otras partes de la aplicación.

Uso de etiquetas URL en plantillas de Django

La etiqueta de plantilla {% url %} de Django es una forma elegante de generar URL directamente dentro de su plantilla. En lugar de codificar las URL, puede hacer referencia a patrones de URL con nombre, para que sus plantillas sean más flexibles y fáciles de gestionar.

Aquí vemos un ejemplo:

 
Leer más 

En este caso, la etiqueta {% url %} crea una URL para la vista blog_post_detail pasando los parámetros year, month y slug . Es importante asegurarse de que estos argumentos coinciden con el patrón de URL definido en su archivo urls.py, que debería tener este aspecto:

path('blog////', views.blog_post_detail, name='blog_post_detail'),

Este enfoque ayuda a mantener sus plantillas limpias y adaptables, sobre todo a medida que evoluciona su proyecto.

Plantillas de Jinja vs. Django

Aunque Django incluye un motor de plantillas integrado (DTL), los desarrolladores también tienen la opción de utilizar alternativas como Jinja.

Jinja es un motor de plantillas para Python popular, moderno y cargado de funciones. Desarrollado inicialmente para el marco de trabajo web Flask, también es compatible con Django.

El motor se diseñó para ser rápido, seguro y muy extensible. Su amplio conjunto de funcionalidades y capacidades lo hacen versátil para la renderización de contenidos dinámicos.

Estas son algunas de las principales funcionalidades y ventajas de Jinja sobre el DTL de Django:

  • Una sintaxis más concisa e intuitiva.
  • Ejecución en entornos de pruebas para una mayor seguridad contra los ataques de inyección de código.
  • Un sistema de herencia más flexible y potente.
  • Mejores herramientas de depuración y mecanismos de generación de informes.
  • Mayor rendimiento al trabajar con plantillas complejas o grandes conjuntos de datos.
  • Funcionalidad mejorada con filtros y macros integrados, que permiten una lógica de renderizado más compleja sin saturar la plantilla.

PyCharm puede detectar de forma automática el tipo de archivo *.jinja y ofrece resaltado de sintaxis, finalización de código y detección de errores junto con compatibilidad con filtros personalizados y extensiones, lo que asegura una experiencia de desarrollo sin problemas.

A pesar de estas ventajas, también es importante recordar que la integración de Jinja en un proyecto Django requiere unos ajustes más complejos y una mayor configuración.

Algunos desarrolladores también pueden preferir quedarse con el motor de plantillas integrado de Django para mantenerlo todo dentro del ecosistema Django.

Codifique más rápido con las plantillas activas de Django

Con la función de plantillas activas de PyCharm, puede insertar rápidamente fragmentos de código de uso común con un simple acceso directo de teclado.

Solo tiene que invocar las plantillas activas pulsando ⌘J, escribiendo ListView y pulsando la tecla Tab.

Esto reduce la codificación repetitiva, acelera el desarrollo y garantiza una sintaxis coherente. Incluso puede personalizar o crear sus propias plantillas para adaptarlas a las necesidades específicas de cada proyecto. Esta funcionalidad resulta especialmente útil para la sintaxis del DTL, en la que los bucles, los condicionales y las estructuras de bloque se repiten con frecuencia.

Uso de plantillas de Django: mejores prácticas y consejos

Trabajar con plantillas de Django es una forma estupenda de gestionar la capa de presentación de sus aplicaciones web.

Sin embargo, seguir las directrices y llevar a cabo optimizaciones de rendimiento es esencial para garantizar que sus plantillas estén bien mantenidas y sean seguras y sistemáticas.

Estas son algunas de las mejores prácticas y consejos que debe recordar cuando utilice plantillas de Django:

  • Separe la presentación y la lógica empresarial. Mantenga las plantillas centradas en la representación de datos y gestione el procesamiento complejo en vistas o modelos.
  • Organice sus plantillas de forma lógica. Siga la estructura de archivos de Django separando las plantillas por aplicación y funcionalidad, utilizando subdirectorios según sea necesario.
  • Utilice las convenciones de nomenclatura de Django. Django sigue un principio de «convención sobre configuración», que le permite nombrar sus plantillas de una manera específica para que no necesite indicar el nombre de su plantilla explícitamente. Por ejemplo, al utilizar vistas basadas en clases como ListView, Django busca automáticamente una plantilla llamada /_list.html, simplificando así su código.
  • Divida las tareas elaboradas en componentes reutilizables. Promueva la reutilización del código y mejore la capacidad de mantenimiento utilizando etiquetas de plantilla, filtros e inclusiones.
  • Siga unas convenciones de nomenclatura coherentes. Utilice nombres claros y descriptivos para sus plantillas, etiquetas y filtros. Esto facilita a otros desarrolladores la lectura de su código.
  • Utilice los filtros de renderizado seguro de Django. Escape siempre los datos proporcionados por el usuario antes de renderizarlos para evitar vulnerabilidades XSS.
  • Documente la lógica compleja de las plantillas. Utilice comentarios claros para explicar las partes complejas de sus plantillas. Esto ayudará a los demás (y a usted mismo más adelante) a entender su código.
  • Perfile sus plantillas. Utilice las herramientas de perfilado de Django para encontrar y optimizar cuellos de botella en el rendimiento como bucles ineficientes y lógica enrevesada.

Vea este vídeo donde encontrará consejos sobre Django y funcionalidades de PyCharm con más detalle.

Conclusión

Tanto si está creado un sitio web simple como si se trata de una aplicación más complicada, ahora ya sabe cómo crear plantillas de Django que mejoren la experiencia del usuario y agilicen su proceso de desarrollo.

Pero las plantillas son solo un componente del marco de trabajo de Django. Explore nuestros otros artículos del blog sobre Django y recursos que pueden ayudarle a aprender Django, descubrir las nuevas funcionalidades de Django y mucho más. También puede familiarizarse con la documentación oficial de Django.

Compatibilidad fiable con Django en PyCharm

Desde principiantes hasta desarrolladores experimentados, PyCharm Professional está a su disposición para ayudarle a agilizar su flujo de trabajo de desarrollo de Django.

El IDE de Django proporciona asistencia para código específico de Django, depuración, previsualizaciones dinámicas, navegación por todo el proyecto y capacidades de refactorización. PyCharm incluye compatibilidad completa con plantillas de Django, lo que le permite gestionarlas y editarlas con facilidad. También puede conectarse a su base de datos con un solo clic y trabajar sin problemas con TypeScript, JavaScript y otros marcos de trabajo de frontend.

Para conocer todos los detalles sobre cómo trabajar con plantillas Django en PyCharm, consulte nuestra documentación. A aquellos que son relativamente nuevos en el marco de trabajo de Django podría irles bien leer primero nuestro tutorial completo, que cubre todos los pasos del proceso para crear una nueva aplicación Django en PyCharm.

¿Listo para empezar? Descargue PyCharm ahora y disfrute de un proceso de desarrollo más productivo.

Artículo original en inglés de:

Evgenia Verbina

Evgenia Verbina

image description

Discover more