Skip to main content

Joblet - Gig Economy Platform

A Django-based marketplace for on-demand tasks and gigs, featuring modern UI with TailwindCSS and comprehensive task management capabilities.

Django Python TailwindCSS DaisyUI PostgreSQL HTML CSS JavaScript

Joblet - Gig Economy Platform

A modern web platform for posting and discovering small, on-demand tasks and gigs. Built with Django and styled with TailwindCSS, Joblet connects service providers with customers for quick, flexible work opportunities.

Overview

Joblet is a marketplace platform designed for the gig economy, enabling users to post “joblets” (small tasks) and allowing service providers to browse and apply for these opportunities. The platform emphasizes simplicity, speed, and ease of use for both parties.

Key Features

For Job Posters (Customers)

  • Quick Task Posting: Create job listings in minutes
  • Category Organization: Organize tasks by type (delivery, repair, creative work, etc.)
  • Applicant Management: Review and select from interested providers
  • Budget Control: Set fixed prices or hourly rates
  • Rating System: Rate providers after job completion

For Service Providers

  • Job Discovery: Browse available tasks filtered by category, location, or budget
  • Application System: Apply to jobs with custom proposals
  • Profile Management: Build a reputation with reviews and completed jobs
  • Earnings Tracking: Monitor income and completed tasks
  • Availability Settings: Set your working hours and preferences

Platform Features

  • User Authentication: Secure registration and login system
  • Profile Pages: Detailed user profiles with ratings and reviews
  • Search & Filters: Advanced filtering by category, location, price, and date
  • Responsive Design: Mobile-first approach with TailwindCSS
  • Dashboard: Personalized dashboards for both customers and providers
  • Notifications: Real-time updates on applications and job status

Technical Implementation

Django Framework

# Clean MVC architecture
- Models: Database schema with Django ORM
- Views: Business logic and request handling
- Templates: Server-side rendering with Django templates
- Forms: Built-in form validation and security
- Admin Panel: Django admin for platform management

Database Design

  • User Model: Extended Django user with custom fields
  • Job Model: Task details, status, pricing
  • Application Model: Provider applications to jobs
  • Review Model: Ratings and feedback system
  • Category Model: Task categorization

Modern UI with TailwindCSS & DaisyUI

  • Utility-first CSS approach
  • Pre-built component library (DaisyUI)
  • Responsive grid layouts
  • Dark mode support
  • Custom color schemes
  • Smooth animations and transitions

User Flows

Customer Journey

  1. Register/Login
  2. Create job posting
  3. Review applicants
  4. Select provider
  5. Mark job complete
  6. Leave review

Provider Journey

  1. Register/Login
  2. Browse available jobs
  3. Submit application
  4. Get selected
  5. Complete task
  6. Receive payment & review

Security Features

Django Security

  • CSRF Protection: Built-in CSRF tokens
  • SQL Injection Prevention: ORM parameterized queries
  • XSS Protection: Template auto-escaping
  • Password Hashing: PBKDF2 algorithm with salt
  • Secure Session Management: Encrypted session cookies
  • Environment Variables: Secret key and credentials protection

Authentication

  • User registration with email verification
  • Secure login with password hashing
  • Session-based authentication
  • Permission-based access control
  • Admin/user role separation

Setup & Configuration

Requirements

Django==4.x
psycopg2-binary
python-decouple
Pillow (for image uploads)

Environment Configuration

SECRET_KEY=your-secure-secret-key
DEBUG=True/False
ALLOWED_HOSTS=localhost,127.0.0.1
DATABASE_URL=postgresql://...

Database Migrations

python manage.py makemigrations
python manage.py migrate
python manage.py createsuperuser

Project Structure

Joblet/
├── app/                    # Main application
│   ├── models.py          # Database models
│   ├── views.py           # View logic
│   ├── forms.py           # Form definitions
│   ├── urls.py            # URL routing
│   └── templates/         # HTML templates
├── Joblet/                # Project configuration
│   ├── settings.py        # Django settings
│   ├── urls.py            # Root URL config
│   └── wsgi.py            # WSGI configuration
├── media/                 # User uploads
├── static/                # Static assets (CSS, JS, images)
├── manage.py             # Django CLI
└── requirements.txt      # Python dependencies

Database Schema

User

  • id, username, email, password
  • first_name, last_name
  • phone, location
  • user_type (customer/provider)
  • created_at

Job

  • id, title, description
  • category (ForeignKey)
  • customer (ForeignKey to User)
  • budget, payment_type
  • location, deadline
  • status (open/in_progress/completed/cancelled)
  • created_at, updated_at

Application

  • id, job (ForeignKey)
  • provider (ForeignKey to User)
  • proposal_text
  • proposed_price
  • status (pending/accepted/rejected)
  • created_at

Review

  • id, job (ForeignKey)
  • reviewer (ForeignKey to User)
  • reviewee (ForeignKey to User)
  • rating (1-5 stars)
  • comment, created_at

UI Components

TailwindCSS Utilities

  • Responsive grid layouts
  • Flexbox utilities
  • Spacing and sizing
  • Color palette customization
  • Typography scales

DaisyUI Components

  • Cards for job listings
  • Badges for categories and status
  • Buttons with variants
  • Form inputs and selects
  • Modal dialogs
  • Alert messages
  • Navigation bars

Features in Detail

Job Posting

  • Rich text description
  • Category selection
  • Budget setting (fixed or hourly)
  • Location specification
  • Deadline picker
  • Photo uploads (optional)

Search & Filtering

  • Full-text search
  • Filter by category
  • Price range slider
  • Location proximity
  • Date posted
  • Job status

Messaging (Future Enhancement)

  • Direct messaging between users
  • Application discussions
  • Job clarifications

Testing

Unit Tests

# Django TestCase
- Model validation tests
- View logic tests
- Form validation tests
- URL routing tests

Integration Tests

  • User registration flow
  • Job posting workflow
  • Application process
  • Review system

Deployment Considerations

Production Setup

  • DEBUG = False
  • Secure SECRET_KEY
  • ALLOWED_HOSTS configuration
  • Static files collection
  • Database connection pooling
  • HTTPS enforcement

Hosting Options

  • Heroku
  • DigitalOcean App Platform
  • Railway
  • AWS Elastic Beanstalk
  • Google Cloud Run

Development Team

  • Martim Santos [114614]
  • Hugo Castro [113889]
  • Gabriel Silva [113786]

Learning Outcomes

This project demonstrates proficiency in:

  • Django Framework: Full-stack web development with Python
  • Database Design: Relational database modeling with PostgreSQL
  • Modern CSS: TailwindCSS utility-first approach
  • Component Libraries: DaisyUI integration
  • Security: Web application security best practices
  • User Experience: Responsive, mobile-first design
  • Project Management: Team collaboration and Git workflow

Technical Highlights

  • Rapid Development: Django’s “batteries included” philosophy
  • Modern UI: TailwindCSS for clean, responsive design
  • Scalable Architecture: MVC pattern for maintainability
  • Security First: Django’s built-in security features
  • Database ORM: Efficient queries with Django ORM
  • Admin Interface: Built-in admin panel for management
  • Form Handling: Automatic validation and error handling

Project Context

Developed for the Web Programming Technologies (TPW) course at University of Aveiro, focusing on:

  • Full-stack web application development
  • Django framework proficiency
  • Modern CSS frameworks (TailwindCSS)
  • Database design and ORM
  • User authentication and authorization
  • Team collaboration in web development