Aplikasi Task Management System adalah sebuah platform untuk mengelola tugas (tasks) secara terpusat. Aplikasi ini dikembangkan dengan arsitektur Monorepo yang memisahkan backend (API) dan frontend (antarmuka pengguna).
Fitur utama meliputi:
- Autentikasi: Register dan Login berbasis JWT.
- Manajemen Tugas: Membuat, Melihat Detail, Mengubah, dan Menghapus tugas.
- Sorting & Filtering: Filter tugas berdasarkan status (TODO, IN_PROGRESS, DONE) dan sorting berdasarkan deadline.
- Akses Tugas: Setiap pengguna hanya dapat melihat tugas yang mereka buat (creator) atau tugas yang ditugaskan kepada mereka (user).
| Komponen | Teknologi Utama | Detail Penting |
|---|---|---|
| Backend (API) | NestJS (Node.js Framework) | Menggunakan arsitektur modular dan TypeScript. |
| Database | PostgreSQL | Dihubungkan melalui TypeORM. |
| Otentikasi | JWT (JSON Web Tokens) & Bcrypt | Implementasi AuthGuard dan JwtService untuk melindungi endpoint. |
| Validasi | Class-Validator | Digunakan secara global melalui ValidationPipe untuk validasi DTO. |
| Frontend (UI) | React | Menggunakan React v19.x terbaru. |
| Routing & Data Fetching | React Router | Menggunakan Loaders dan Actions untuk fetching dan modifikasi data deklaratif. |
| Styling & UI Library | Tailwind CSS & Shadcn/ui | Menggunakan komponen UI modern. |
Pastikan Anda memiliki Node.js (disarankan v18+) dan PostgreSQL terinstal.
-
Instal Dependensi:
cd backend pnpm install -
Konfigurasi Environment: Buat file .env di direktori backend berdasarkan .env.example.
DB_HOST=localhost DB_PORT=5432 DB_USER=your_user DB_PASSWORD=your_password DB_DATABASE=task-management JWT_TOKEN=YOUR_SECRET_KEY
-
Jalankan Aplikasi, server akan berjalan di port 3000
pnpm start:dev
-
Instal Dependensi:
cd frontend pnpm install -
Konfigurasi Environment: Buat file .env di direktori frontend berdasarkan .env.example.
VITE_API_BASE_URL=http://localhost:3000
-
Jalankan Aplikasi (Development), aplikasi berjalan pada port 5173:
pnpm dev
Anda dapat membuat akun pertama dengan melakukan register atau menggunakan informasi login berikut
{
"username": "mily",
"password": "mainpubg"
}
Aplikasi menggunakan dua entitas utama (User dan Task) yang saling berelasi di PostgreSQL.
| Kolom | Tipe Data | Deskripsi |
|---|---|---|
| user_id | int4 | Primary Key, Auto-generated. |
| name | character varying | Nama lengkap pengguna. |
| username | character varying | Nama pengguna unik. |
| password | character varying | Hash kata sandi (kolom disembunyikan secara default). |
| Kolom | Tipe Data | Deskripsi |
|---|---|---|
| task_id | int4 | Primary Key, Auto-generated. |
| title | character varying | Judul task. |
| description | character varying | Deskripsi task. |
| status | ENUM('TODO', 'IN_PROGRESS', 'DONE') | Status task. |
| deadline | date | Tanggal deadline task |
| user_id | int4 | Foreign Key ke user sebagai pelaksana. |
| created_by | int4 | Foreign Key ke user sebagai pembuat task. |
Halaman yang ditampilkan merupakan halaman CRUD Task
