Django debugging – adding Django Debug Toolbar to the project

by Alex
Django debugging - adding Django Debug Toolbar to the project

In this article, we’re going to talk about how we can do Django debugging. Let’s look at an important technique that is required in web development and then move on to adding the Debug Toolbar library.

What is debugging

Regardless of professionalism, every developer deals with bugs – it’s part of the job. Debugging bugs is not an easy task; initially it takes a lot of time to detect a bug and to fix it. Consequently, every developer needs to know how to fix bugs. In Django, the debugging process can be greatly simplified. You just need to install and plug Django Debug Toolbar into your application. Now that we know why debugging is so important, let’s set it up in the project.

Preparing the application for the demo

The example code is in the repository on GitLab. To use the debugging toolbar, we need a website. If you have your own project, you can use it. Otherwise, create a new one and add the following view and corresponding path. Commands to create a new application:

$ pip install django
$ django-admin startproject debug-tool
$ cd debug_tool
$ python manage.py startapp app
# app/views.py
from django.http import HttpResponse
def sample_view(request):
html = 'Django sample_view

Debug sample_view

‘ return HttpResponse(html)

Make sure the tag is present. Otherwise, the debugger tool will not display on pages whose templates do not have this tag. The URL path for the code will be:

# debug_tool/urls.py
from app import views as app_views
urlpatterns = [
path('admin/', admin.site.urls),
path('sample/', app_views.sample_view),
]

Now you’ll be able to repeat after me.

Django Debug Toolbar

Let’s take a look at the tools that are presented in the toolbar:

  • Version: Provides the version of Django we are using.
  • Time: Reports the time it took to load the web page.
  • Setting: Shows page settings.
  • Request: Shows all requests – views, files, cookies, etc.
  • SQL: A list of database queries.
  • Static Files: Provides information about static files.
  • Templates: Provides information about templates.
  • Cache: Provides information about existing cache.
  • Loggin: Shows the number of logs logged.

Installing the Debug Toolbar in Django

Now let’s install the library and configure everything you need for it. Follow the step-by-step instructions:

1) Install the library

To install django-debug-toolbar, use the pip install command. Run the following code in a terminal/OS shell:

pip install django-debug-toolbar

2) Add to INSTALLED_APPS

In settings.py, add the following line to the INSTALLED_APPS section. Make sure that debug_toolbar is added after django.contrib.staticfiles.

# debug_tool/settings.py
INSTALLED_APPS = [
...
'debug_toolbar',
]

Also make sure that the following line STATIC_URL = '/static/' is present in the settings.py file. It is usually at the end of the module and does not need to be added. If it’s not there, just add it to the end of the file.

3) Import into urls.py

To use the Debug Toolbar, we have to import its paths. Hence, in urls.py add the code:

# debug_tool/urls.py
...
from django.conf import settings
from django.urls import path, include
# urlpatterns = [....
if settings.DEBUG:
import debug_toolbar
urlpatterns = [
path('__debug__/', include(debug_toolbar.urls)),
] + urlpatterns

Make sure that DEBUG is set to TRUE in settings.py to make everything work. This is what my urls.py file looks like: Debug Toolbar URLsDebug ToolBar urls.py

4) Connect MiddleWare

Add the middleware toolbar debug_toolbar.middleware.DebugToolbarMiddleware, to the MIDDLEWARE list in settings.py.

# debug_tool/settings.py
...
MIDDLEWARE = [..
...
'debug_toolbar.middleware.DebugToolbarMiddleware',
]
...

5) Mention INTERNAL_IPS

Django Debug Toolbar is only displayed if the INTERNAL_IPS list contains the application’s IP. To develop on a local computer, add IP 127.0.0.1 to the list.

# debug_tool/settings.py
...
INTERNAL_IPS = [
'127.0.0.1',
]

If the INTERNAL_IPS list does not already exist, add it to the end of settings.py. At this point we have finished connecting the debug panel, now let’s check how it works.

Displaying the Django Debug Toolbar

After adding all the code, go to 127.0.0.1:8000/sample/ in your browser. Отображение Django Debug Toolbar If you see the sidebar as in the image, it worked! If not, check if any of the above code snippets are missing from your files. That’s it, the toolbar will appear on the right side of the page every time it loads. The official documentation in English is here.

Related Posts

LEAVE A COMMENT