Building a To-Do List App with Python and Django: Step-by-Step Guide

Django is a high-level Python web framework that allows developers to build robust and scalable web applications quickly. In this tutorial, we’ll build a simple To-Do list app using Django, walking you through the entire process from setup to deployment.

---

1. Prerequisites

Before starting, make sure you have Python and Django installed. If Django is not installed, you can install it with:

# Install Django
pip install django

Create a new Django project and navigate to the project folder:

# Create a Django project
django-admin startproject todo_app

# Navigate into the project folder
cd todo_app

---

2. Creating a Django App

Create a new app within the project to handle our To-Do list functionality:

# Create a Django app
python manage.py startapp tasks

Now, add the new app to your project’s INSTALLED_APPS in settings.py:

# settings.py
INSTALLED_APPS = [
    'tasks',
    # Other installed apps...
]

---

3. Creating the To-Do List Model

A model in Django represents the data structure. Let’s create a Task model to store our To-Do items:

# tasks/models.py
from django.db import models

class Task(models.Model):
    title = models.CharField(max_length=100)
    completed = models.BooleanField(default=False)

    def __str__(self):
        return self.title

After creating the model, run the following commands to create and apply the database migrations:

# Create and apply migrations
python manage.py makemigrations
python manage.py migrate

---

4. Creating Views for the To-Do List

Next, create views to display the list of tasks and handle the creation of new tasks.

# tasks/views.py
from django.shortcuts import render, redirect
from .models import Task

def task_list(request):
    tasks = Task.objects.all()
    return render(request, 'tasks/task_list.html', {'tasks': tasks})

def add_task(request):
    if request.method == 'POST':
        new_task = Task(title=request.POST['title'])
        new_task.save()
        return redirect('task_list')
    return render(request, 'tasks/add_task.html')

---

5. Creating URLs for the App

Create URLs to map views to specific routes. In the tasks app, create a urls.py file:

# tasks/urls.py
from django.urls import path
from . import views

urlpatterns = [
    path('', views.task_list, name='task_list'),
    path('add/', views.add_task, name='add_task'),
]

Include these URLs in the main project’s urls.py:

# todo_app/urls.py
from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('tasks.urls')),
]

---

6. Creating Templates

Create templates to display the tasks and a form to add new tasks. Create a templates/tasks folder and add the following files:

task_list.html:

<h1>To-Do List</h1>
<ul>
    {% for task in tasks %}
    <li>{{ task.title }} - {% if task.completed %}Done{% else %}Pending{% endif %}</li>
    {% endfor %}
</ul>
<a href="{% url 'add_task' %}">Add New Task</a>

add_task.html:

<h1>Add New Task</h1>
<form method="POST">
    {% csrf_token %}
    <input type="text" name="title" placeholder="Task title" required>
    <button type="submit">Add Task</button>
</form>
<a href="{% url 'task_list' %}">Back to To-Do List</a>

---

7. Running the App

Start the Django development server:

# Run the server
python manage.py runserver

Open http://127.0.0.1:8000/ in your browser, and you should see your To-Do list app in action!

---

8. Conclusion

Congratulations! You’ve built a simple To-Do list app using Django. This project introduces key Django concepts such as models, views, templates, and URLs. You can further enhance this app by adding features like task editing, deletion, and user authentication.

Happy coding!