About DeskDev

DeskDev is a robust project management web application based on the Kanban board methodology, tailored specifically for development, IT, and business teams. Built on the modern architecture of Laravel 12 and styled with a distinctive "Playful Neobrutalism" user interface, DeskDev delivers an engaging, interactive, and visually striking task management experience.

This project was developed as a capstone assignment, implementing industry-standard practices including session management, comprehensive authentication (manual and Google OAuth), complex relational database design, and responsive web design principles.

---

Technology Stack

• Framework: Laravel 12 (PHP 8.2+)
• Database: MySQL (Local Environment) & PostgreSQL via Supabase (Cloud Sync)
• Frontend: Laravel Blade, Tailwind CSS v4, Vanilla JavaScript
• Authentication: Laravel Session Authentication & Laravel Socialite (Google OAuth)
• UI Architecture: Custom Neobrutalism Design System (Hard shadows, distinct borders, micro-animations)

---

Core Features

1. Comprehensive Authentication System
   • Secure manual registration and login utilizing Email and Password (Session-based).
   • Integrated Single Sign-On (SSO) via Google accounts.
2. Project and Space Management
   • Create and organize new projects with unique identifiers (Key Prefixes).
   • Automated project progress tracking based on task status calculations.
3. Interactive Kanban Board
   • Intuitive drag-and-drop functionality for moving tasks between status columns.
   • Customizable workflow columns to match team requirements (e.g., To Do, In Progress, Review).
   • Rapid filtering capabilities to sort tasks by priority or type (Bug, Task, Story).
4. Task Tracking and Details
   • Management of Story Points, priority assignment (Low, Medium, High), and due date tracking.
   • Real-time description editing via detailed modal views.
5. Responsive and Playful Design
   • Full mobile device support featuring an off-canvas sidebar menu.
   • Engaging micro-animations on interactive elements, custom cursors, and system notifications.

---

Application Overview

The complete DeskDev web application interface, featuring the signature Neobrutalist design language, intuitive Kanban boards, and comprehensive project management dashboards.

---

Database Architecture

Entity Relationship Diagram illustrating the core data structures and relations.

DeskDev utilizes a robust relational schema centered around the following primary entities:

• users: Securely manages authentication data including names, emails, encrypted passwords, and OAuth identifiers (google_id).
• projects: Acts as the central container for user-owned workspaces and their associated metadata.
• statuses: Defines the customizable Kanban columns that dictate the workflow for specific projects.
• tasks: The fundamental unit of work, containing detailed descriptions, priorities, and establishing the many-to-one relationships between workflow statuses and parent projects.

---

Local Development and Installation

Follow these instructions to configure and run DeskDev in a local environment using XAMPP:

1. Clone the Repository

   git clone https://github.com/yourusername/deskdev.git
   cd deskdev

2. Install Dependencies

   composer install
   npm install

3. Environment Configuration Duplicate the example environment file:

   cp .env.example .env

   Configure the .env file with your local MySQL credentials:

   DB_CONNECTION=mysql
   DB_HOST=127.0.0.1
   DB_PORT=3306
   DB_DATABASE=deskdev_db
   DB_USERNAME=root
   DB_PASSWORD=

4. Generate Application Key

   php artisan key:generate

5. Execute Database Migrations Ensure your local MySQL service (XAMPP) is running, then execute:

   php artisan migrate

6. Compile Frontend Assets and Start the Server

   # Terminal 1: Compile CSS/JS assets
   npm run dev
   
   # Terminal 2: Initialize the Laravel development server
   php artisan serve

7. Access the Application Navigate to http://localhost:8000 in your preferred web browser.

---

Developed with dedication by Muhammad Zidane.