Django Template implementation process (Part I)
Django templates are used to insert Python elements into HTML to build dynamic websites easier.
The present paperwork is dedicated to posing the implementation of a simple application. Further deployments are coming soon in a second part.
Project setup
- Creation
In order to create a Django project run the following instruction in the terminal:
django-admin startproject hello_world2. Start the project
Access the hello_world directory and run it in the terminal:
python3 manage.py runserverThen go to the localhost: http://127.0.0.1:8000/ and find the standard Django web deployment.
So far so good, we’d implemented a starter Django website. Now, we can move into the implementation of the first Template.
Creating the first Template
Let’s start creating a templates folder with an HTML file (let’s call it first_template.html) and declare the basic HTML structure.
Feel free to add some HTML tags with content in the Body.
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> Hello World</body></html>
Then create a views.py file in which the template will be called as follows:
from django.http import HttpResponsefrom django.template import Template, Contextdef first_template(self): html_path = open(‘/Users/octaviolafourcade/Documents/PYTHON/django/hello_world/hello_world/templates/first_template.html’) template = Template(html_path.read()) html_path.close() context = Context() document = template.render(context) return HttpResponse(document)
- Be sure to import HttpResponse, Template, and Context.
- Define a function in which it will be declared the full path of the template.
- The context will be used to pass arguments to be used in the template.
Now, assign a route to the view first_template in the urls.py file. Don’t forget to import first_template!
from django.contrib import adminfrom django.urls import pathfrom hello_world.views import first_templateurlpatterns = [ path('admin/', admin.site.urls), path('first_template/', first_template),]
Now, go to http://127.0.0.1:8000/first_template/ and it will be displayed Hello World.
Review the code implemented up to this point here:
https://github.com/tavolafourcade/django/commit/c3d85a214b60eeb6beb47d328c9fe8bc664626ef
Improving the template
Context is used to pass arguments to the template. Let’s do it as follows:
from django.http import HttpResponsefrom django.template import Template, Contextdef first_template(self): name = 'John' last_name = 'Doe' dictionary = {'name': name, 'last_name': last_name} html_path = open('/Users/octaviolafourcade/Documents/PYTHON/django/hello_world/hello_world/templates/first_template.html') template = Template(html_path.read()) html_path.close() context = Context(dictionary) document = template.render(context) return HttpResponse(document)
Then implement some minor changes to the first_template.html
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <h1>Hello World</h1> <br> <p style="color: red">My name is {{name}}</p> <p style="color: blue">My last name is {{last_name}}</p></body></html>
Review the code implemented up to this point here:
https://github.com/tavolafourcade/django/commit/81e7a6a62bd265ce263e185d848ec3bb87db7b9a
Template loaders
Imagine a project with many views to display! Declaring the full path for every view would be overwhelming.
Loaders are used to assess this situation.
Let’s start importing the loader in views.py
from django.template import loaderThen, move the full path from the views.py into settings.py and add it to DIRS array from TEMPLATES array.
'DIRS': ['/Users/octaviolafourcade/Documents/PYTHON/django/hello_world/hello_world/templates/'],With this in mind, the context its not needed anymore so we can update the views.py as follow:
from django.http import HttpResponsefrom django.template import Template, Context, loaderdef first_template(self): name = 'John' last_name = 'Doe' dictionary = {'name': name, 'last_name': last_name} template = loader.get_template('first_template.html') document = template.render(dictionary) return HttpResponse(document)
So far, the implementation of the loader is complete. The code implemented in this section can be found here:
https://github.com/tavolafourcade/django/commit/385e3a3f5639a38c54f01ea3b427b001f6e17122
In the next article, the main idea will be the implementation of a Model.
