Create a Task Management System with Django

Creating a Task Management System using Django was an exciting journey! This project allowed me to grasp essential web development concepts, including CRUD operations, user authentication, task status management, and notifications.

I’ll walk you through how I built the system, its core functionalities, and how you can enhance it with more practical features. Whether you’re a beginner or looking to level up your Django project, this guide will be a valuable resource.

Features of My Task Management System

A Task Management System is designed to efficiently create, track, update, and delete tasks. Below are the core functionalities:

User Authentication System

  • Login Page: Authenticates users before they access the system.
  • Signup Page: Allows new users to register.
  • Forgot Password: Provides a recovery option for users who forget their credentials.

CRUD Operations (Create, Read, Update, Delete) for Task Management

  • Create Tasks: Users can create tasks with a title, description, and due date.
  • Read Tasks: Tasks are displayed in a structured dashboard.
  • Update Tasks: Users can modify task details.
  • Delete Tasks: Tasks can be removed once completed or deemed unnecessary.

Task Status Management

  • Tasks can be categorized as Pending, In Progress, or Completed.
  • Users can filter tasks based on their status.

User Roles & Permissions

  • Admin: Manages all users and tasks.
  • Regular User: Manages only their assigned tasks.

Notifications & Alerts

  • Email Notifications: Users receive email reminders for upcoming task deadlines.
  • Reminders: Pending tasks trigger notifications.

Enhancing the System with Practical Features

To make the project more useful and engaging, I considered several upgrades:

Implement a Task Deadline Reminder System

  • Use Celery and Django-cron to send automatic email reminders before task deadlines.
  • Example: If a task is due tomorrow, the system sends an email reminder to the user.

Add Drag-and-Drop Task Prioritization

  • Implement JavaScript (jQuery UI or Dragula.js) to allow users to reorder tasks based on priority.

Implement Real-Time Notifications

  • Use Django Channels + WebSockets to update the task list in real time when a new task is created or completed.

Task Progress Tracking (Kanban Board)

  • Integrate a Kanban board-style UI (similar to Trello) where users can drag tasks between To Do, In Progress, and Done sections.

Attach Files & Comments to Tasks

  • Allow users to upload attachments (PDFs, images, docs) related to tasks.
  • Include a comment section for team discussions within a task.

Add a Dashboard with Analytics

  • Use Chart.js or Django Admin Stats to visualize key metrics such as:
    • Number of tasks completed per month
    • Task completion rate
    • Most active users

Dark Mode / Theme Customization

  • Provide an option for users to switch between light and dark themes for better user experience.

Task Model with Status Management and Reminders

Here’s a basic Django implementation of my Task Model with status management and reminders:

from django.db import models
from django.contrib.auth.models import User
from django.utils import timezone
from django.core.mail import send_mail

class Task(models.Model):
    STATUS_CHOICES = [
        ('pending', 'Pending'),
        ('in_progress', 'In Progress'),
        ('completed', 'Completed'),
    ]

    title = models.CharField(max_length=255)
    description = models.TextField()
    due_date = models.DateTimeField()
    status = models.CharField(max_length=20, choices=STATUS_CHOICES, default='pending')
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    created_at = models.DateTimeField(auto_now_add=True)

    def send_deadline_reminder(self):
        """Send an email reminder if the task is nearing its deadline."""
        if self.due_date - timezone.now() < timezone.timedelta(days=1):  # 1 day before
            send_mail(
                subject=f"Task Reminder: {self.title}",
                message=f"Your task '{self.title}' is due soon! Complete it before {self.due_date}.",
                from_email="noreply@taskmanager.com",
                recipient_list=[self.user.email],
            )

    def __str__(self):
        return self.title

Enhancing the Login UI with Django & Tailwind CSS

My login screen UI can be further improved using Tailwind CSS for better styling.

Django Login View (views.py)

from django.contrib.auth import authenticate, login
from django.shortcuts import render, redirect
from django.contrib import messages

def user_login(request):
    if request.method == 'POST':
        username = request.POST['username']
        password = request.POST['password']
        user = authenticate(request, username=username, password=password)
        if user:
            login(request, user)
            return redirect('dashboard')
        else:
            messages.error(request, "Invalid credentials!")
    
    return render(request, 'login.html')

Login Page Template (login.html using Tailwind CSS)

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Login - Task Manager</title>
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="flex items-center justify-center h-screen bg-gradient-to-r from-blue-500 to-green-500">
    <div class="w-96 p-6 shadow-lg bg-black text-white rounded-lg">
        <h2 class="text-2xl font-bold mb-5 text-center">Login</h2>
        <form method="POST">
            {% csrf_token %}
            <div class="mb-4">
                <label class="block mb-1">Username</label>
                <input type="text" name="username" class="w-full px-4 py-2 border rounded-lg bg-gray-900 text-white" required>
            </div>
            <div class="mb-4">
                <label class="block mb-1">Password</label>
                <input type="password" name="password" class="w-full px-4 py-2 border rounded-lg bg-gray-900 text-white" required>
            </div>
            <button type="submit" class="w-full bg-white text-black py-2 rounded-lg font-bold">Login</button>
        </form>
        <div class="text-center mt-4">
            <a href="{% url 'signup' %}" class="text-blue-400">Sign Up</a> |
            <a href="{% url 'password_reset' %}" class="text-red-400">Forgot Password?</a>
        </div>
    </div>
</body>
</html>

Final Thoughts

  • Built a functional Task Management System using Django.
  • Implemented CRUD operations, user authentication, task status management, and notifications.
  • Suggested practical enhancements like task reminders, real-time updates, drag-and-drop prioritization, and Kanban boards.
  • Shared an improved login UI using Tailwind CSS.

Related blog posts