Prisma ORM dan Turso (dengan Next.js 14+ App Router)

Pertama diterbitkan pada 2024. Contoh mengikuti versi yang digunakan saat itu. Edisi migrasi ini tidak menyertakan screenshot dashboard dan output bantuan CLI lama. Detail koneksi diganti dengan placeholder aman.

Prisma ORM mempunyai keunggulan penulisan schema yang sederhana dan Prisma Client yang dapat digunakan di backend secara typesafe. Prisma mendukung berbagai DBMS berbasis SQL, termasuk SQLite. Jika ingin men-deploy aplikasi, kita juga perlu tempat untuk menyimpan data SQLite. Salah satu pilihan DBaaS untuk SQLite adalah Turso.

Di tulisan ini, saya akan berbagi penggunaan Turso dan Prisma pada Next.js 14+ (App Router).

Preparing

Sebelum menggunakan Turso, kita perlu melakukan setup Next.js dan Prisma.

Instalasi Next.js

Install Next.js lalu masuk ke folder aplikasinya:

npx create-next-app my-next-app
cd my-next-app

Instalasi Prisma

npm install @prisma/client
npm install prisma --save-dev
npx prisma init

Setup Prisma

Tuliskan model pada /prisma/schema.prisma:

generator client {
  provider = "prisma-client-js"
}

datasource db {
  provider = "sqlite"
  url      = "file:./dev.db"
}

model Post {
  id        Int      @id @default(autoincrement())
  title     String
  content   String?
  createdAt DateTime @default(now())
}

Jalankan proses migrasi:

npx prisma migrate dev --name init

Migrasi bernama init menghasilkan file SQL di /prisma/migrations/[date]_init/migration.sql dan Prisma Client yang bisa dipakai untuk mengakses model secara typesafe. Jika client belum dihasilkan, jalankan:

npx prisma generate

Setup Prisma dan Next.js

Buat file /src/server/db.ts:

import { PrismaClient } from "@prisma/client"

const createPrismaClient = () =>
  new PrismaClient({
    log:
      process.env.NODE_ENV === "development"
        ? ["query", "error", "warn"]
        : ["error"],
  })

const globalForPrisma = globalThis as unknown as {
  prisma: ReturnType<typeof createPrismaClient> | undefined
}

export const db = globalForPrisma.prisma ?? createPrismaClient()

if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = db

Dengan begitu, Prisma Client dapat dipanggil menggunakan variabel db.

Turso

Instalasi Turso CLI

Turso menyediakan CLI untuk mengelola dan berkomunikasi dengan database. Perintah instalasi Homebrew pada artikel asli:

brew install tursodatabase/tap/turso
turso --help

Turso login

Buka Turso dan masuk menggunakan akunmu. Saya menggunakan provider GitHub. Setelah login di browser, kembali ke terminal:

turso auth login

Turso dashboard

Masuk ke menu Databases dan pilih Create Database. Isi nama database dan group. Dalam contoh ini saya menggunakan nama testing. Setelah selesai, buka dashboard database tersebut.

Menghubungkan Prisma ke Turso

Buat file lokal .env:

TURSO_DATABASE_URL=
TURSO_AUTH_TOKEN=

Detail database dapat diperoleh dengan menjalankan:

turso db show testing

Gunakan URL dan token milikmu sendiri. Nilai di bawah ini hanya placeholder, bukan kredensial yang dapat digunakan:

TURSO_DATABASE_URL=libsql://your-database.turso.io
TURSO_AUTH_TOKEN=your-private-token

Jangan membagikan auth token atau memasukkan file .env lokal ke repository.

Prisma adapter

Untuk versi Prisma pada artikel ini, tambahkan driverAdapters pada generator:

generator client {
  provider        = "prisma-client-js"
  previewFeatures = ["driverAdapters"]
}

Ubah /src/server/db.ts untuk membuat LibSQL client dan adapter:

import { PrismaClient } from "@prisma/client"
import { PrismaLibSQL } from "@prisma/adapter-libsql"
import { createClient } from "@libsql/client"

const libsql = createClient({
  url: `${process.env.TURSO_DATABASE_URL}`,
  authToken: `${process.env.TURSO_AUTH_TOKEN}`,
})

const adapter = new PrismaLibSQL(libsql)

const createPrismaClient = () =>
  new PrismaClient({
    adapter,
    log:
      process.env.NODE_ENV === "development"
        ? ["query", "error", "warn"]
        : ["error"],
  })

const globalForPrisma = globalThis as unknown as {
  prisma: ReturnType<typeof createPrismaClient> | undefined
}

export const db = globalForPrisma.prisma ?? createPrismaClient()

if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = db

Kemudian jalankan migrasi lagi:

npx prisma migrate dev --name init

Push migration ke Turso

Workflow asli menggunakan database shell untuk mengirim SQL hasil migrasi. Sesuaikan nama database dan path migrasi dengan milikmu:

turso db shell testing < ./prisma/migrations/20240902093411_init/migration.sql

Kembali ke dashboard dan buka editor database yang tersedia. Tabel Post seharusnya sudah ada. Jika database tidak aktif, periksa status dan pengaturannya melalui dashboard.

Kesimpulan

Dengan menggabungkan Prisma dan Turso, kita dapat mengelola dan men-deploy aplikasi Next.js berbasis SQLite secara cloud-native. Turso menyediakan SQLite di cloud, sementara Prisma membantu pengelolaan schema database secara typesafe di TypeScript.