Site icon FSIBLOG

Create a Task Management System with Django

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

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

Task Status Management

User Roles & Permissions

Notifications & Alerts

Enhancing the System with Practical Features

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

Implement a Task Deadline Reminder System

Add Drag-and-Drop Task Prioritization

Implement Real-Time Notifications

Task Progress Tracking (Kanban Board)

Attach Files & Comments to Tasks

Add a Dashboard with Analytics

Dark Mode / Theme Customization

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

Exit mobile version