Django Template Language (DTL) Tutorial 🎯

Welcome to our comprehensive guide on Django Template Language (DTL)! In this tutorial, we'll dive deep into DTL, a powerful and versatile templating system used in Django web development. By the end of this guide, you'll be able to create dynamic, data-driven web pages with ease. Let's get started! 📝

What is Django Template Language (DTL)?

Django Template Language (DTL) is a built-in templating engine in Django that allows you to create dynamic web pages with Python-like syntax. It simplifies the process of displaying data from your Django models in a user-friendly format, making it a must-learn for Django developers. 💡 Pro Tip: DTL is not only easy to use but also secure, as it automatically escapes output to prevent cross-site scripting attacks.

Getting Started with DTL

To begin, let's create a new Django project and app:

bash

django-admin startproject my_project
cd my_project
python manage.py startapp my_app

Now, let's create a simple view and a template. In your my_app/views.py, create a view:

python

from django.shortcuts import render

def home(request):
    context = {'message': 'Welcome to Django!'}
    return render(request, 'my_app/home.html', context)

Create a template in my_app/templates/my_app/home.html:

html

<!DOCTYPE html>
<html>
<head>
    <title>Home</title>
</head>
<body>
    <h1>{{ message }}</h1>
</body>
</html>

In this example, {{ message }} is a variable that gets its value from the context dictionary created in the view.

Basic DTL Templates

DTL allows you to display, manipulate, and loop through data with various tags and filters. Here are some basic examples:

Variables

html

<h1>{{ message }}</h1>

Loops

html

{% for item in list %}
    <p>{{ item }}</p>
{% endfor %}

If Statements

html

{% if condition %}
    <!-- code if condition is true -->
{% else %}
    <!-- code if condition is false -->
{% endif %}

Advanced DTL

Let's delve into more advanced topics like filters, blocks, and extensions.

Filters

Filters are used to manipulate data before it's displayed. For example, upper filter converts text to uppercase:

html

<h1>{{ message|upper }}</h1>

Blocks

Blocks allow you to define a section in a base template that can be overridden in child templates:

html

<!-- Base Template -->
<!DOCTYPE html>
<html>
<head>
    <title>{% block title %}Default Title{% endblock %}</title>
</head>
<body>
    {% block content %}
        <!-- Default content -->
    {% endblock %}
</body>
</html>

<!-- Child Template -->
<!DOCTYPE html>
<html>
<head>
    <title>{% block title %}My Custom Title{% endblock %}</title>
</head>
<body>
    {% block content %}
        <!-- Custom content -->
    {% endblock %}
</body>
</html>

Extensions

Extensions allow you to customize DTL with your own functions. More on this in future tutorials!

Putting it all Together

Now that you understand the basics of DTL, let's create a more complex example:

Create a simple Django model:

python

from django.db import models

class Post(models.Model):
    title = models.CharField(max_length=200)
    content = models.TextField()
    created_at = models.DateTimeField(auto_now_add=True)

Create a view and template to display a list of posts:

python

def posts(request):
    posts = Post.objects.all()
    context = {'posts': posts}
    return render(request, 'my_app/posts.html', context)

html

<!DOCTYPE html>
<html>
<head>
    <title>Posts</title>
</head>
<body>
    <h1>Posts</h1>
    {% for post in posts %}
        <h2>{{ post.title }}</h2>
        <p>{{ post.content }}</p>
        <small>{{ post.created_at }}</small>
    {% endfor %}
</body>
</html>

Quiz

That's it for our Django Template Language tutorial! We've covered the basics of DTL, including variables, loops, if statements, filters, blocks, and extensions. With these skills, you're well on your way to creating dynamic, data-driven web pages with Django. Happy coding! 🎉