ถ้าคุณกำลังทำ Next.js และต้องการให้เว็บของคุณเชื่อมต่อกับฐานข้อมูล อย่างง่ายและมีประสิทธิภาพ คุณคงเคยปวดหัวกับการเขียน SQL Query ตรง ๆ หรือการจัดการ Migrations ใช่ไหม? 🤯
วันนี้เราจะมาแนะนำ Prisma 🏆 ซึ่งเป็น ORM (Object-Relational Mapping) ที่ทำให้การจัดการฐานข้อมูลกับ Next.js เป็นเรื่องง่าย อ่านโค้ดสวยสะอาดตา และใช้งานได้ทั้ง TypeScript และ JavaScript
🎯 Prisma คืออะไร?
Prisma เป็น ORM ที่ช่วยให้เราทำงานกับฐานข้อมูล ง่ายขึ้น แทนที่เราจะต้องเขียน SQL ตรง ๆ เราสามารถใช้ Prisma Client เพื่อดึงหรือบันทึกข้อมูลได้สะดวกขึ้น
🔥 จุดเด่นของ Prisma
✅ Type-safe → ใช้กับ TypeScript ได้เต็มที่
✅ Readable Code → โค้ดอ่านง่ายขึ้นเยอะ
✅ Auto Migrations → จัดการโครงสร้างฐานข้อมูลได้ง่าย
✅ รองรับหลาย Database → PostgreSQL, MySQL, SQLite, MongoDB, etc.
✅ ทำงานร่วมกับ Next.js ได้ดีมาก
🛠 ติดตั้ง Prisma ใน Next.js
ก่อนอื่น เราต้องมี Next.js Project ก่อน ถ้ายังไม่มีให้สร้างด้วยคำสั่งนี้
npx create-next-app my-next-app
cd my-next-app
จากนั้น ติดตั้ง Prisma และ PostgreSQL Client (หรือ Database อื่น ๆ ที่คุณใช้)
npm install @prisma/client @prisma/cli pg
🔹 ตั้งค่า Database Connection
Prisma ใช้ไฟล์ .env เพื่อเก็บ Database URL
🔧 เปิดไฟล์ .env แล้วเพิ่มค่าต่อไปนี้
DATABASE_URL=postgresql://username:password@localhost:5432/mydatabase
📌 เปลี่ยน username, password, และ mydatabase ให้ตรงกับ Database ของคุณ
🔹 ตั้งค่า Prisma Schema
สร้างโฟลเดอร์ prisma/ และไฟล์ schema.prisma
npx prisma init
ตอนนี้โครงสร้างโปรเจกต์ของคุณควรเป็นแบบนี้
/my-next-app
├── /prisma
│ └── schema.prisma
├── /pages
├── /components
├── .env
├── package.json
🔧 แก้ไขไฟล์ prisma/schema.prisma
generator client {
provider = "prisma-client-js"
}
datasource db {
provider = "postgresql"
url = env("DATABASE_URL")
}
model User {
id Int @id @default(autoincrement())
name String
email String @unique
}
🔹 สร้าง Database Migration
ใช้คำสั่งนี้เพื่อให้ Prisma สร้างตารางใน Database ตาม Schema ที่เรากำหนด
npx prisma migrate dev --name init
📌 คำสั่งนี้จะสร้างตาราง User ในฐานข้อมูลของคุณ
🔹 ใช้ Prisma ใน API Routes ของ Next.js
💡 เราจะลองสร้าง API ที่จัดการ Users โดยใช้ Prisma
📌 อ่านข้อมูล Users (/pages/api/users.js)
import { PrismaClient } from '@prisma/client'
const prisma = new PrismaClient()
export default async function handler(req, res) {
if (req.method === 'GET') {
const users = await prisma.user.findMany()
res.json(users)
}
}
✅ ตอนนี้เรามี API ที่สามารถดึง Users ได้แล้ว
📌 เพิ่ม User ใหม่ (/pages/api/users.js)
import { PrismaClient } from '@prisma/client'
const prisma = new PrismaClient()
export default async function handler(req, res) {
if (req.method === 'POST') {
const { name, email } = req.body
const newUser = await prisma.user.create({
data: { name, email }
})
res.json(newUser)
}
}
✅ ตอนนี้เราสามารถเพิ่ม Users ได้แล้ว
📌 แก้ไขข้อมูล User (/pages/api/users/[id].js)
import { PrismaClient } from '@prisma/client'
const prisma = new PrismaClient()
export default async function handler(req, res) {
const { id } = req.query
if (req.method === 'PUT') {
const { name, email } = req.body
const updatedUser = await prisma.user.update({
where: { id: Number(id) },
data: { name, email }
})
res.json(updatedUser)
}
}
✅ ตอนนี้เราสามารถอัปเดตข้อมูล Users ได้แล้ว
📌 ลบ User (/pages/api/users/[id].js)
import { PrismaClient } from '@prisma/client'
const prisma = new PrismaClient()
export default async function handler(req, res) {
const { id } = req.query
if (req.method === 'DELETE') {
await prisma.user.delete({
where: { id: Number(id) }
})
res.json({ message: 'User deleted' })
}
}
✅ ตอนนี้เราสามารถลบ Users ได้แล้ว
🎯 ทำไมต้องใช้ Prisma กับ Next.js?
| ฟีเจอร์ | Prisma | SQL Query ตรง ๆ |
|---|---|---|
| ใช้งานง่าย | ✅ | ❌ |
| อ่านโค้ดง่าย | ✅ | ❌ |
| รองรับ TypeScript | ✅ | ❌ |
| มีระบบ Migrations | ✅ | ❌ |
| จัดการ Query Complex ได้ง่าย | ✅ | ❌ |
📌 ถ้าคุณต้องการ ORM ที่ใช้งานง่ายและรองรับ TypeScript ดี → Prisma คือคำตอบ!
🎯 สรุป
✅ Prisma เป็น ORM ที่ช่วยให้คุณทำงานกับ Database ใน Next.js ได้ง่ายขึ้น
✅ รองรับ PostgreSQL, MySQL, SQLite, MongoDB
✅ ใช้ร่วมกับ Next.js API Routes ได้ดี
✅ ใช้งานง่าย อ่านโค้ดสบายตา
