Build a fullstack web app with React and NestJS on Bun — TypeScript end-to-end, MongoDB persistence, and one deployable stack.
เข้าใจ tradeoffs ของภาษาก่อน — เมื่อไหร่ JS/TS ชนะ และเมื่อไหร่ที่ควรใช้ภาษาอื่น
ติดตั้ง Bun และรันโปรแกรมแรก — ใช้เป็น runtime และ package manager ทั้งสองฝั่ง
type system ที่ใช้ร่วมกันทั้ง React, NestJS และ Mongoose — จับให้แน่นก่อนไปต่อ
HTTP, TCP, DNS — พื้นฐานที่ fullstack developer ทุกคนต้องรู้ ทั้งฝั่ง browser และ server
JSX rules, lists กับ key, conditional rendering, children — หน่วยพื้นฐานของทุก UI
useState, immutable updates, lifting state — state model ที่ bug ส่วนใหญ่ย้อนกลับมาที่นี่
useEffect คือ synchronization กับโลกภายนอก — และ fetching แบบมือเปล่าคือรากของ TanStack Query
nested routes กับ layout, RequireAuth สำหรับหน้าที่ต้อง login, redirect กลับหลัง login
state สามชนิดสามบ้าน — useState, Context/Zustand, และ server data ที่เป็นของ TanStack Query
react-hook-form + Zod ฝั่ง client, DTO + ValidationPipe ฝั่ง server — contract เดียวกันสองฝั่ง
modules, providers, constructor injection — โครงสร้างเดียวกับ Spring ที่ทีม backend รู้จักดี
route + DTO + service — สามไฟล์ที่ทุก feature ของ NestJS ลงเอยเหมือนกันหมด
guard ตัดสินว่ารันไหม, pipe validate input, interceptor ครอบ execution — cross-cutting ไม่ต้อง copy-paste
RESTful conventions, versioning, pagination, error responses — ออกแบบ API ที่คนอื่นใช้งานได้
document model vs tables — เลือกถูกตั้งแต่ต้น แล้ว query ส่วนใหญ่จะง่ายขึ้นเอง
embed vs reference — การตัดสินใจ schema ที่สำคัญที่สุดของ MongoDB ตัดสินด้วย access pattern
dashboard, report, ยอดรวม — pipeline คือ query language สำหรับอะไรที่ลึกกว่า find()
forRoot เปิด connection ที่ AppModule, forFeature ลงทะเบียน schema ต่อ feature — inject ผ่าน DI
@Schema + @Prop นิยาม collection, repository ครอบ model — ownership scoping เขียนครั้งเดียว
populate แบบไม่เจอ N+1, transaction สำหรับ multi-document writes ที่ต้องสำเร็จพร้อมกัน
server state ไม่ใช่ client state — cache, invalidation, loading/error ที่ component เรียกใช้แบบ declarative
AuthN vs AuthZ, sessions vs JWT — เข้าใจ concept ก่อน แล้วค่อย implement ใน stack นี้
ครบวงจร — bcrypt + passport-jwt, guard ทุก route, Zustand session, RequireAuth + redirect กลับ
Vite dev proxy, enableCors ฝั่ง NestJS, ConfigService + getOrThrow — config ที่ fail ตอน boot ไม่ใช่ตอนรัน
supertest ยิง Nest app จริง ใน DB ใหม่ — test contract, auth และ ownership ในชุดเดียว บวก RTL สำหรับ component
logging, monitoring, configuration, health checks — สิ่งที่ทำให้ service รันได้จริงบน production
สอง image — nginx serve React + Bun รัน NestJS — ผูกด้วย compose เดียว พร้อม Mongo
Workshop: TaskFlow — fullstack task manager ครบทุกอย่างที่เรียนมา (auth, CRUD, tests, Docker)
