An open API service indexing awesome lists of open source software.

https://github.com/kanywtipm/school-dashboard

School DashBoard Management
https://github.com/kanywtipm/school-dashboard

clerkauth cloudinary-api docker hostinger javascript nextjs postgresql prisma react reacthookform tailwindcss toastify typescript

Last synced: 16 days ago
JSON representation

School DashBoard Management

Awesome Lists containing this project

README

          

# School Management Dashboard

## คำอธิบายโปรเจค
School Management Dashboard เป็นระบบจัดการข้อมูลโรงเรียนที่ออกแบบมาเพื่อสนับสนุนการจัดการข้อมูลของนักเรียน ครู ผู้ปกครอง ผู้ดูแลระบบ โดยมีฟีเจอร์หลักที่ช่วยให้ผู้ใช้งานสามารถ:

- ตรวจสอบตัวตนและกำหนดสิทธิ์การใช้งานตามบทบาท
- จัดการข้อมูลนักเรียน เช่น การลงทะเบียน ระดับชั้น ห้องเรียน วิชาเรียน
- แสดงผลข้อมูลตามสิทธิ์ของผู้ใช้งานผ่านแดชบอร์ด

ระบบได้ถูกออกแบบมาเป็นแดชบอร์ดโรงเรียนที่สนับสนุนสถาปัตยกรรมโมเดลข้อมูลล่าสุดเพื่อช่วยให้ผู้ใช้งานสามารถนำทาง เข้าใจ และจัดการข้อมูลที่เกี่ยวข้องกับการศึกษาได้อย่างมีประสิทธิภาพ ประกอบด้วย:

🔐 Authentication & Authorization (via Clerk)

📊 Modern UI/UX using Tailwind CSS

☁️ Media handling with Cloudinary API

🧩 Form validation and user input handling with React Hook Form and Toastify

🐳 Deployment-ready containerization using Docker

🗃️ Robust database structure with PostgreSQL and Prisma ORM

🌐 Hosting on Hostinger

---

## วิธีติดตั้ง
1. **Clone Repository**
```bash
git clone
cd <ชื่อโปรเจค>
```

2. **ติดตั้ง Dependencies**
```bash
npm install
# หรือใช้ package manager อื่น เช่น yarn, pnpm
```

3. **ตั้งค่า Environment Variables**
สร้างไฟล์ `.env` และใส่ค่าที่จำเป็น เช่น:
```env
DATABASE_URL=
NEXT_PUBLIC_API_KEY=
```

4. **รันเซิร์ฟเวอร์สำหรับพัฒนา**
```bash
npm run dev
```
จากนั้นเปิดเบราว์เซอร์และไปที่ [http://localhost:3000](http://localhost:3000)

---

## การใช้งาน
### ขั้นตอนเบื้องต้น
1. เข้าสู่ระบบผ่านทางหน้าเว็ปไซต์จะนำเข้าสู่หน้าล็อคอินเพื่อใช้งานตามบทบาท
2. เลือกดูเมนูที่อยู่ในบทบาทของคุณ เช่น การจัดการชั้นเรียน (สำหรับครู) หรือการดูผลการเรียน (สำหรับผู้ปกครอง)

### คำสั่งที่เกี่ยวข้อง
- **Build โปรเจค:**
```bash
npm run build
```
- **เริ่มระบบ Production:**
```bash
npm start
```
- **Linting:**
```bash
npm run lint
```

---
## School Dashboard

[![Live Demo](https://img.shields.io/badge/Live%20Demo-Online-green)](http://194.164.150.9:3000/)

🚀 **เข้าใช้งาน:** [http://194.164.150.9:3000/](http://194.164.150.9:3000/)