กลับหน้า Coding

Project

Klasa

แพลตฟอร์มโรงเรียนสำหรับนักเรียน ครู และผู้ดูแลระบบ ครอบคลุมเช็คชื่อ เกรด ตารางเรียน คะแนนความประพฤติ จุดเด่นคือระบบแจ้งเหตุฉุกเฉิน (SOS ติดตามพิกัดเรียลไทม์ ตรวจจับแผ่นดินไหวอัตโนมัติ) และ Google Workspace SSO สำหรับโรงเรียนหลายแห่ง ออกแบบเป็น microservices แยกตาม domain

Klasa
เลื่อนลง
Klasa — ระบบแจ้งเหตุฉุกเฉิน (Emergency Alert)
01

ระบบแจ้งเหตุฉุกเฉิน (Emergency Alert)

ครูกด SOS แบบ slide-to-confirm ระบบส่ง Push แจ้งเตือนนักเรียนทุกคนผ่าน Kafka ทันที พร้อมสตรีมพิกัด GPS ทุก 10 วินาที ตรวจสอบระยะด้วย Ray-casting Geofence และแสดงตำแหน่งเรียลไทม์บนแผนที่ (Leaflet) ฝั่งแอดมินผ่าน WebSocket นอกจากนี้ยังตรวจจับแผ่นดินไหวอัตโนมัติจาก EMSC feed แล้วคำนวณระยะห่างจากโรงเรียนเพื่อแจ้งเตือนตามเกณฑ์ความรุนแรง

Klasa — Google Workspace SSO (GAFE)
02

Google Workspace SSO (GAFE)

ออกแบบระบบล็อกอินด้วย Google Sign-In สำหรับโรงเรียนที่ใช้ Google Workspace for Education ตรวจสอบ ID token และ hd claim เพื่อระบุโรงเรียนอัตโนมัติ ผูกบัญชีด้วย Google sub ครั้งแรกผ่านการยืนยันรหัสนักเรียนและวันเกิด แล้วออก JWT เดิมของระบบต่อโดยไม่ต้องแก้ไข service อื่น

Klasa — Microservices แบบ Event-Driven
03

Microservices แบบ Event-Driven

แยกเป็น 12+ microservices ตาม domain (login, personnel, schedule, attendance, behavior, grades, news, upload) เขียนด้วย Go Fiber/Gin สื่อสารกันแบบ sync ผ่าน REST/gRPC และ async ผ่าน Kafka (KRaft) ทุก request เข้าผ่าน Kong API Gateway จุดเดียว ใช้แพทเทิร์น database-per-service กับ PostgreSQL

Klasa — ฟีเจอร์หลักสำหรับโรงเรียน
04

ฟีเจอร์หลักสำหรับโรงเรียน

ครบทั้งเช็คชื่อ/ลา คะแนนความประพฤติ ตารางเรียน เกรดพร้อมคำนวณ GPA ถ่วงน้ำหนัก ข่าวประชาสัมพันธ์ และแผงควบคุมผู้ดูแลระบบ (Next.js + React) จัดการบุคลากรแบบ batch อัปโหลด Excel พร้อม service แยกต่างหากด้วย Python + Google OR-Tools สำหรับจัดเส้นทางเยี่ยมบ้านนักเรียน

Screens

ภาพหน้าจอจริงของแอป

ตารางเรียน

ตารางเรียน

ส่งใบลา

ส่งใบลา

จัดการบุคลากร (เว็บแอดมิน)

จัดการบุคลากร (เว็บแอดมิน)

แผนที่ฉุกเฉินเรียลไทม์ (เว็บแอดมิน)

แผนที่ฉุกเฉินเรียลไทม์ (เว็บแอดมิน)

Flows

Flow การทำงานทั้งหมด 11 ระบบ

1ระบบ Login (ปกติ / Google SSO / ลืมรหัสผ่าน)
2แจ้งเหตุฉุกเฉิน (SOS)
3ตรวจจับแผ่นดินไหวอัตโนมัติ
4ระบบเกรด
5ตรวจสอบเวอร์ชันแอป
6จัดเส้นทางเยี่ยมบ้าน
7แชทเรียลไทม์
8อนุมัติใบลา
9ลงทะเบียนข่าวประชาสัมพันธ์
10นำเข้ารายชื่อนักเรียนจาก Excel
11อัปโหลดรูปภาพ
ดู Flow ทั้งหมด

Architecture

สถาปัตยกรรมระบบ

แผนผังสถาปัตยกรรมของ Klasa

Structure

โครงสร้างโปรเจกต์

schoolapp/
├── app/# Flutter — แอปนักเรียน/ครู
├── server/login/# Auth Service :8080 — JWT, GAFE SSO
├── server/personnel/# นักเรียน/ครู/ห้องเรียน :8082 gRPC
├── server/manageclassschedule/# ตารางเรียน :8083 gRPC
├── server/attendance_api/# เช็คชื่อ/ลา :8081
├── server/behavior/# คะแนนความประพฤติ :8084
├── server/grades_api/# เกรด/GPA ถ่วงน้ำหนัก :8088
├── server/emergency_api/# SOS + ตรวจจับแผ่นดินไหว :8087
├── server/upload_api/# อัปโหลดไฟล์ → MinIO :8085
├── server/news/# ข่าวประชาสัมพันธ์ :8086
├── server/chat_api/# แชทเรียลไทม์ — WebSocket
├── server/home_visit_api/# จัดเส้นทางเยี่ยมบ้าน
├── server/notifier/ + mailer/# Kafka consumer → FCM / Gmail SMTP
├── server/ortools_service/# Python + OR-Tools — คำนวณเส้นทาง TSP
└── web/# Admin panel — Next.js + React
app/

แอป Flutter สำหรับนักเรียนและครู เชื่อม Firebase Messaging และ Google Sign-In

FirebaseGeolocatorGAFE SSO
server/login/

Auth Service — JWT, สมัคร/ล็อกอิน, ตรวจเวอร์ชันแอป, ลืมรหัสผ่านผ่าน Kafka

JWTGAFE SSO
server/personnel/

จัดการนักเรียน/ครู/ห้องเรียน/โรงเรียน

gRPC :50051
server/manageclassschedule/

ตารางเรียน วิชา หน่วยกิต และภาคเรียน

gRPC :50052
server/attendance_api/

เช็คชื่อและระบบยื่นใบลา

server/behavior/

บันทึกและให้คะแนนความประพฤติ

server/grades_api/

บันทึกเกรด คำนวณ GPA ถ่วงน้ำหนัก ตั้งเวลาประกาศผล

server/emergency_api/

SOS, สตรีม GPS, Geofence, ตรวจจับแผ่นดินไหวอัตโนมัติ

Redis GEOWebSocket
server/upload_api/

อัปโหลดไฟล์เข้า MinIO

MinIO
server/news/

ข่าวและประกาศของโรงเรียน

server/notifier/ + mailer/

Kafka consumer ส่ง Push (FCM) และอีเมล (Gmail SMTP)

FCMSMTP
server/ortools_service/

จัดเส้นทางเยี่ยมบ้านนักเรียนด้วย Google OR-Tools

PythonFastAPI
web/

แผงควบคุมผู้ดูแลระบบ จัดการบุคลากรแบบ batch อัปโหลด Excel

Next.jsReact
ดูโค้ดบน GitHub

Stack

FlutterGo FiberKongPostgreSQLRedisKafkaMinIOFCMNext.jsReactPythongRPCKubernetes