Project Management

KanBan_TaskFlow

cablemomo2027 · ส่วนตัว

KanBan_TaskFlow
ภาพรวมอ่านจบใน 30 วินาที

สรุปโปรเจกต์

ภาพรวม

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:

  • users
  • boards
  • board_members
  • columns
  • tasks
  • notifications

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/.env
  • frontend/.env.local

Required backend variables:

  • SUPABASE_URL
  • SUPABASE_SERVICE_ROLE_KEY
  • JWT_SECRET
  • DATABASE_URL
  • PORT

Required frontend variables:

  • NEXT_PUBLIC_SUPABASE_URL
  • NEXT_PUBLIC_SUPABASE_ANON_KEY
  • NEXT_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:dev
  • npm run build
  • npm run start:prod

Frontend:

  • npm run dev
  • npm run build
  • npm run start

Notes

  • node_modules and .env files 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

Project AI

ถาม AI เกี่ยวกับ KanBan_TaskFlow

ถามแนวทาง เทคโนโลยี หรือความเหมาะสมของโปรเจกต์นี้กับไอเดียของคุณ

กำลังโหลดแชท / Loading chat…

ผู้มีส่วนร่วม
คุยกับ AI ดูงานคล้ายกันติดต่อจ้างงาน