Next.js から Prisma ORM を利用する

BRANK

Next.js に Prisma ORM を導入する方法について解説します。Next.js プロジェクトの雛形を作成$ mkdir hello-next-app && cd hello-next-app $ npm init -y $ npm install next react react-dom --save $ npm install typescript @types/node @types/react --save-dev $ code src/index.tsx scr/index.tsx を作成export default function Index() { return <div>index</div>; } 一度 next build すると、 typescript の型定義が生成されるので、一回ビルド。ビルド対象に tsx があることで、 next が tsconfig.json で next-env.d.ts を生成します。Prisma をセットアップ依存に追加。$ npm install @prisma/client@2 --save $ npm install @prisma/cli@2 --save-dev prisma ディレクトリにスキーマを追加します。今回は sqlite3 を選択。prisma/schema.prismagenerator client { provider = "prisma-client-js" } datasource db { provider = "sqlite" url = "file:./dev.db" } model Post { authorId Int? content String? id Int @id @default(autoincrement()) published Boolean @default(false) title String author Us…