CRUD with Django, PostgreSQL, Bootstrap and Heroku — Part 5: Configuring templates with Bootstrap and FontAwesome
In the previous part, we saw how to configure requests on our Django files.
Now, we’ll code some things on our templates.
First, we should have a structure like this:
What we want now is to create a pattern inside base.html file.
...
<body> {% block content %}
{% endblock content %}</body>
...
Now, we’ll extend what we create on base.html inside the employee_form.html and employee_list.html files.
employee_form.html:
{% extends 'employee_register/base.html' %}{% block content %} <p>We'll show Django form to implement CRUD operations.</p>{% endblock content %}
employee_list.html
{% extends 'employee_register/base.html' %}{% block content %} <p>We'll show Django list to implement CRUD operations</p>{% endblock content %}
Then, we test our Django server to see if our templates are working.
python manage.py runserver
If we access to http://localhost:8000/employee we should see the following text
Then, we try with http://localhost:8000/employee/list and we’ll get another text:
Now, we’re able to work with HTML templates. For this project, we’ll be using Bootstrap framework, in order to save some time and use responsive elements, and FontAwesome will be used for the icons.
We’ll configure our templates for using Bootstrap framework and FontAwesome icons.
Get FontAwesome CDN for Bootstrap
Now, we’re ready to work with Bootstrap and FontAwesome.