目標

Prismaをインストールして実行、データーの追加の確認まで
Postgresqlのインストールはこちら

動作環境

• postgresql ver 14
• windows 10
• nextjs
• Typescript

Prismaを使う経緯

PrismaはORM?とかわけのわからないことが書いてあったためなんか大変そうだと思い遠慮していました。使わなくてもできるし...
しかし現実はデータベースの種類が異なり、それによって異なるパッケージをインストールして使う必要が出てしまいました。そのため覚えないといけないライブラリーが増えてしまいます。使用するデータベースを統一して欲しい...
そんなとき、そういえばPrismaと言うものがあったな、使って見ようかということで今回使ってみました。

Prismaを使うメリット、デメリット

メリット

メリットとしては色々なデータベースに対応しているのでこれさえできれば新しく覚える必要が無くなります。 また補完機能があるので命名で間違えることが無くなります。 データベースのクエリーコマンドを覚える必要が無くなります。

デメリット

やっぱり難しいです。覚えないといけない部分がそれなりにあります。様々なデータベースに対応しているとはいえ多少異なる部分は存在します。 公式のドキュメントはかなりしっかりしており、サンプルも用意されているのでありがたいのですが、やっぱり日本語のドキュメント、サンプルも欲しいですね。 また、prismaを介さないでデータベースの型等を操作してしまうとprismaで再度型を更新する時テーブル内のデーターを全部消してしまうのでこれはちょっと手間です。
firebaseを使ってしまえば、データベースを構築やPrismaを使用する必要が全くないので簡単なデータベースなら使う必要も無いのが現状です。

Prismaを使う

prismaの使い方（公式）が載っているためその通りに進めて行きます。

1.データベースアクセスまでの設定

Prismaをインストールし、データベースにアクセスするための設定記入していきます。
必要なライブラリーをインストールします。

npm install prisma typescript ts-node @types/node --save-dev
npx prisma init

initすることでprismaフォルダーが作成されます。

中を見てみると以下のようになっています。

// This is your Prisma schema file,
// learn more about it in the docs: https://pris.ly/d/prisma-schema

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

datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

envにデータベースアクセスURLを記入するようになっているのでそれにしたがって.envファイルを変更します。

# This was inserted by `prisma init`:
# Environment variables declared in this file are automatically made available to Prisma.
# See the documentation for more detail: https://pris.ly/d/prisma-schema#accessing-environment-variables-from-the-schema

# Prisma supports the native connection string format for PostgreSQL, MySQL, SQLite, SQL Server, MongoDB and CockroachDB.
# See the documentation for all the connection string options: https://pris.ly/d/connection-strings

DATABASE_URL="postgresql://johndoe:randompassword@localhost:5432/mydb?schema=public"
#例DATABASE_URL="postgresql://testuser:Password@localhost:5432/newdb"

上記で絶対に記入が必要な部分はデータベース名「newdb」までです。それ以降はオプションなのであってもなくても大丈夫です。.envのコメント通りになりますが、postgreSQL以外のDBを利用している場合は多少記述が異なります。公式が丁寧に解説してくれています。URLの書き方も書いてあるので参考にしてください。 公式
ここまででデータベースの接続のための設定が終わりました。

注意
Prismaでデータベースの作成はできません。prismaはテーブル、カラムの修正ができます。データベースは別の方法で作成してください。

2.テーブルの作成

次にテーブルを作成します。「schema.prisma」の修正です。
公式では結構色々なテーブルを作成しているので複雑なので、ここでは一つだけ作成します。

// This is your Prisma schema file,
// learn more about it in the docs: https://pris.ly/d/prisma-schema
generator client {
  provider = "prisma-client-js"
}
datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}
model User {
  id      Int      @id @default(autoincrement())
  email   String   @unique
  name    String?
  profileid Int?
}

その後prismコマンドでテーブルを作成します。

npx prisma migrate dev --name init

コマンドを実行するとprismaがデータベースのテーブルを書き換え作業を実行します。成功すると次のように日付_initと言う名前で何かが作成されます。

テーブルの更新がある場合

テーブルの修正がある場合は同じく「schema.prisma」を修正し、prisma migrateコマンドを実行します。 以下はテーブル名を「User」から「userslist」に変更しました。

model userslist {
  id      Int      @id @default(autoincrement())
  email   String   @unique
  name    String?
  profileid Int?
}

同様なコマンドで最後だけを次に変更 --name table-rename

npx prisma migrate dev --name table-rename

このように変更が加えられて、履歴が残ります。

ここまででpostgreSQLの接続ができ、初期設定が終わりました。 そして、migrate のコマンドでnode_modulesの中に色々書き換えられ、テーブルの補完機能が追加されています。

データの追加

先ほどの手順でデータベースの接続、テーブルの作成をしました。 しかしデータの追加、更新、削除はまた別の「prisma/client」が必要です。

prisma clientを使う

まずはインストール

npm install @prisma/client

これだけです。
使い方は new でインスタンス作成します。 DBのアクセスのパスワード等は既に.envに記入したためデータベースの接続設定はありません。

データの追加

以下のコマンドだけでデーターを追加できます。

import { PrismaClient } from '@prisma/client'

const prisma = new PrismaClient();
  await prisma.userslist.create({
    data:{
      name : "name" ,
      email : "[email protected]" , 
      profileid  : 1 
    }
  });

注意点

DBの操作はフロント側では不可能なのでサーバーサイドに記入する必要があります。ですよねーーー...
next.js の場合APIを作成するか、getServerSidePropsを利用することで実行が可能です。 apiを作るのがちょっと複雑化されてしまうためここではgetServerSidePropsを使用します。
もちろん本稼働時はapiを作るべきですが

postgresqlにデーターを追加する。

サーバーサイドの機能なので通常のフロント側で実装してもエラーが表示されます。そのためサーバーサイドの処理であるgetServerSidePropsを使います。

import { PrismaClient } from '@prisma/client'
import { GetServerSideProps } from "next";

export default function Home(props:any) {
  return (
  <h1>登録人数は：{props.count}</h1>
  )
}
export const getServerSideProps: GetServerSideProps<any> = async () => {
  const prisma = new PrismaClient();
 await prisma.userslist.create({
    data:{
      name : "name" ,
      email : "[email protected]" , 
      profileid  : 1 
    }
  });
  const count = await prisma.userslist.count()
  const users = await prisma.userslist.findMany()
  console.log(count);
  console.log(users);

  return {
    props: {
      count,
    },
  };
};

注意事項

• emailはuniqueで設定しています重複の登録があるとエラーではじかれます。
• await prisma.userlist.create です「await」が重要です。

重複を許可するためにschema.prismaを修正します。 @uniqueを削除してください。

model userslist {
  id      Int      @id @default(autoincrement())
  email   String   
  name    String?
  profileid Int?
}

npx prisma migrate dev --name delete unique

これで重複登録ができるようになりました。

npx next dev

ブラウザーでリロードすると次のように表示されます。

公式のドキュメント

Prismaは公式のドキュメントがしっかりしています。

• テーブルの型
• クエリーデータ追加、削除、更新等
• テーブル操作既存のテーブルから型を作る「pull」、デプロイ用の「migrate deploy」等

まとめ

覚えること結構多く大変です。しかしその分、prisma一つを覚えてしまえばデータベース周りは困ることが無くなります。柔軟に色々なデータベースに対応できるし、テーブル作成もjsだけで作成することができる。補完機能があるのでテーブルカラム名なんだっけ？と検索することも、カラム名の文字の間違えも無くなります。 絶対に今後も役に立ちます。 firebaseとかを使えば確かにprismaは確かに不要です。
ウェブページはともかく、ウェブアプリはどこかしらデータベースを利用しているので今後も絶対に必要になります。そのためprismaは必須だと感じます。