KanBan_TaskFlow
cablemomo2027 · ส่วนตัว
สรุปโปรเจกต์
ภาพรวม
TaskFlow แอปพลิเคชัน Kanban Workspace ที่พัฒนาด้วย Next.js 16 และ NestJS 10 พร้อมระบบจัดการบอร์ด คอลัมน์ และงานแบบครบวงจรบนฐานข้อมูล Supabase/PostgreSQL
สรุป 30 วินาที
• รองรับระบบยืนยันตัวตนและการจัดการสมาชิก • ลากวางงานข้ามคอลัมน์แบบเรียลไทม์ • ธีมแสง/มืดและจัดเก็บข้อมูลบอร์ดเฉพาะผู้ใช้
เหมาะกับใคร
เหมาะสำหรับทีมพัฒนาที่ต้องการโซลูชันจัดการงานแบบยืดหยุ่น หรือโปรเจกต์ศึกษาสถาปัตยกรรม Full-stack แบบ Modern
- หมวดหมู่
- Project Management
- ปี
- 2026
- ผู้ดูแลผลงาน
- cablemomo2027
รายละเอียดเพิ่มเติมรายละเอียดเชิงลึก
TaskFlow เป็นแพลตฟอร์มจัดการงานแบบคัมบังที่ออกแบบมาเพื่อเพิ่มประสิทธิภาพการทำงานเป็นทีม รองรับฟีเจอร์ครบครันตั้งแต่การสร้างบอร์ด คอลัมน์ และงาน ไปจนถึงการลากวางเพื่อจัดลำดับความสำคัญ พร้อมระบบแจ้งเตือนและจัดการสมาชิกภายในบอร์ด
ระบบหลังบ้านพัฒนาด้วย NestJS เชื่อมต่อกับฐานข้อมูล PostgreSQL ผ่าน Supabase เพื่อความเสถียรและขยายได้ง่าย ส่วนหน้าเว็บใช้ Next.js และ React 19 รองรับ App Router พร้อมฟีเจอร์ธีมสว่าง-มืดและการบันทึกสถานะงานแบบแยกผู้ใช้
โครงสร้างโปรเจกต์แบ่งส่วนชัดเจนระหว่าง API และ Frontend รองรับการติดตั้งและรันในสภาพแวดล้อมการพัฒนาได้อย่างรวดเร็ว เหมาะสำหรับการจัดการงานแบบ Agile หรือการติดตามงานรายบุคคลและทีม
เอกสารต้นฉบับรายละเอียด (README)
Kanban Workspace
TaskFlow is a Kanban workspace app with a Next.js frontend and a NestJS backend. It supports authentication, boards, columns, tasks, members, invitations, notifications, theming, and per-user board persistence on the frontend.
Stack
- Frontend: Next.js 16, React 19
- Backend: NestJS 10
- Database/Auth storage: Supabase
- Database engine: PostgreSQL
Database
This project uses PostgreSQL as the main database, hosted on Supabase.
Main tables include:
usersboardsboard_memberscolumnstasksnotifications
Project Structure
Kanban/
|- backend/ # NestJS API
|- frontend/ # Next.js app
Features
- User registration and login
- Board creation and board membership
- Invite members to boards
- Create columns and tasks
- Drag and drop tasks between columns
- My Tasks and Members pages
- Light and dark mode
Environment Files
Backend example: backend/.env.example
Frontend example: frontend/.env.example
Create local env files before starting:
backend/.envfrontend/.env.local
Required backend variables:
SUPABASE_URLSUPABASE_SERVICE_ROLE_KEYJWT_SECRETDATABASE_URLPORT
Required frontend variables:
NEXT_PUBLIC_SUPABASE_URLNEXT_PUBLIC_SUPABASE_ANON_KEYNEXT_PUBLIC_API_URL
Install
Backend:
cd backend
npm install
Frontend:
cd frontend
npm install
Run In Development
Start backend:
cd backend
npm run start:dev
Start frontend:
cd frontend
npm run dev
Default local URLs:
- Frontend:
http://localhost:3000 - Backend:
http://localhost:3001
Database Notes
- Base schema:
backend/schema.sql - Additional migrations:
backend/migration_v2.sql,backend/migration_v3.sql
Run the SQL files in Supabase SQL Editor if your database is not initialized yet.
Useful Scripts
Backend:
npm run start:devnpm run buildnpm run start:prod
Frontend:
npm run devnpm run buildnpm run start
Notes
node_modulesand.envfiles are ignored by git.- The app uses App Router routes in
frontend/src/app. - If Next.js route changes behave strangely, restart the frontend dev server.
Thai Version
Thai documentation: README.th.md
ถาม AI เกี่ยวกับ KanBan_TaskFlow
ถามแนวทาง เทคโนโลยี หรือความเหมาะสมของโปรเจกต์นี้กับไอเดียของคุณ
กำลังโหลดแชท / Loading chat…