Todo List Web App using Django

Author - Neelima Mohanty
9/02/2022 | 10:30 PM

Hello everyone ! Everyday , both at home and workplace , we accomplish a lot of tasks but often forget which tasks we have completed and which are yet to be completed.Inorder to solve this problem we make Todo lists.But if you are a python lover and application developer just like me , this tutorial here helps you out to make a wonderful Todo-List app by using Django framework as its backend.


• Knowledge about basic web framework(HTML,CSS,Javascript).
• Familiarity with Python programming language.
• Django framework setup.

Tutorial Begins

Follow the steps written below:

Step 1 : Django Project Creation

Open VSCode editor and type the following in the terminal and type the following coomands :

django-admin startproject <Projectname>
python startapp home

Step 2 : Linking Templates

Create static and template folders(HTML,CSS and Javascript ....frontend files will be stored inside the templates).
Reffer the files present in the github repo (link provided at enk of this tutorial).

In under TEMPLATES (fill the following directory)


Also add this

STATICFILES_DIR = [os.path.join9BASE_DIR,'static')]

Move to and add the following code:

from django.urls import path,include

Add a URL to urlpatterns:

path('blog/', include('blog.urls'))

Step 3 : Setting up admin

Copy all code from and paste in home/
Add a URL to urlpatterns:

path('', views.home,name='home'),

Delete admin path and also add this

from home import views

Step 4 : Home

Add HttpResponse to import and insert the following lines of code inside url :

def home(request):
    return render(request,'index.html')

Step 5 : Tasks

Create index.html and tasks.html file inside templates directory.
Add a URL to urlpatterns for tasks:

path('tasks', views.tasks,name='tasks

Step 6 : Continue with Tasks

In add this

def tasks(request):
    return render(request,'tasks.html')

Step 7 : Models

Create file and add the code below into it.

class Task(models.Model):

In add 'home' to Installed apps.
In add the following:

from home.models import Task

Step 8 : Create Superuser

In another terminal,type the command

python create superuser

Then fill everything asked.

Step 9 : Linking Models and Tasks

Go to and under class Task create a funtion

def __str__(self):

In index.html make a form tag and after that tag type {%csrf_token%}

Step 9 : Tasks addition and success message display

In add

def home(request):
    if request.method =="POST":
        title = request.POST['title']
        desc= request.POST['desc']
        ins = Task(taskTitle = title,taskDescription=desc)
        context = 'success':True
    return reder(request,'index.html',context)

Step 10 : Finishing the project

In index.html under /nav tag add {% if success %} Alert Message {% endif %}
In file add :

def task(request):     allTasks = Task.objects.all()     context = {'tasks'.allTasks}     return reder(request,'task.html',context)

In tasks.html after tbody tag add {% for tasks in tasks%}


People who read this also read


Application of smtplib module

Author: Neelima Mohanty
20/01/2022 | 10:30 PM