【Better Auth】NextJs & tRPC 【#2 Drizzle ＆ Neon】

【#2 Drizzle ＆ Neon】

YouTube: https://youtu.be/ZA4aEWqWQDg
https://youtu.be/ZA4aEWqWQDg

今回は「Drizzle」と「Neon」を使用してデータベースの構築を行います。

https://orm.drizzle.team/docs/get-started/neon-new

https://neon.com/

npm i drizzle-orm @neondatabase/serverless dotenv
npm i -D drizzle-kit tsx

src/db/index.ts

import { drizzle } from "drizzle-orm/neon-http";

export const db = drizzle(process.env.DATABASE_URL!);

src/db/schema.ts

import { integer, pgTable, varchar } from "drizzle-orm/pg-core";

export const usersTable = pgTable("users", {
  id: integer().primaryKey().generatedAlwaysAsIdentity(),
  name: varchar({ length: 255 }).notNull(),
  age: integer().notNull(),
  email: varchar({ length: 255 }).notNull().unique(),
});

drizzle.config.ts

import "dotenv/config";
import { defineConfig } from "drizzle-kit";

export default defineConfig({
  out: "./drizzle",
  schema: "./src/db/schema.ts",
  dialect: "postgresql",
  dbCredentials: {
    url: process.env.DATABASE_URL!,
  },
});

.env

DATABASE_URL='postgresql://neondb_owner:xxxxxxxxxxxxxxxxxxxxxxx=require'

package.json

{
  "name": "better-auth-prot",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbopack",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@hookform/resolvers": "^5.2.0",
    "@neondatabase/serverless": "^1.0.1",
    "@radix-ui/react-accordion": "^1.2.11",
    "@radix-ui/react-alert-dialog": "^1.1.14",
    "@radix-ui/react-aspect-ratio": "^1.1.7",
    "@radix-ui/react-avatar": "^1.1.10",
    "@radix-ui/react-checkbox": "^1.3.2",
    "@radix-ui/react-collapsible": "^1.1.11",
    "@radix-ui/react-context-menu": "^2.2.15",
    "@radix-ui/react-dialog": "^1.1.14",
    "@radix-ui/react-dropdown-menu": "^2.1.15",
    "@radix-ui/react-hover-card": "^1.1.14",
    "@radix-ui/react-label": "^2.1.7",
    "@radix-ui/react-menubar": "^1.1.15",
    "@radix-ui/react-navigation-menu": "^1.2.13",
    "@radix-ui/react-popover": "^1.1.14",
    "@radix-ui/react-progress": "^1.1.7",
    "@radix-ui/react-radio-group": "^1.3.7",
    "@radix-ui/react-scroll-area": "^1.2.9",
    "@radix-ui/react-select": "^2.2.5",
    "@radix-ui/react-separator": "^1.1.7",
    "@radix-ui/react-slider": "^1.3.5",
    "@radix-ui/react-slot": "^1.2.3",
    "@radix-ui/react-switch": "^1.2.5",
    "@radix-ui/react-tabs": "^1.1.12",
    "@radix-ui/react-toggle": "^1.1.9",
    "@radix-ui/react-toggle-group": "^1.1.10",
    "@radix-ui/react-tooltip": "^1.2.7",
    "@tanstack/react-query": "^5.83.0",
    "@trpc/client": "^11.4.3",
    "@trpc/server": "^11.4.3",
    "@trpc/tanstack-react-query": "^11.4.3",
    "better-auth": "^1.3.4",
    "class-variance-authority": "^0.7.1",
    "client-only": "^0.0.1",
    "clsx": "^2.1.1",
    "cmdk": "^1.1.1",
    "date-fns": "^4.1.0",
    "dotenv": "^17.2.1",
    "drizzle-orm": "^0.44.3",
    "embla-carousel-react": "^8.6.0",
    "input-otp": "^1.4.2",
    "lucide-react": "^0.528.0",
    "nanoid": "^5.1.5",
    "next": "15.4.4",
    "next-themes": "^0.4.6",
    "react": "19.1.0",
    "react-day-picker": "^9.8.1",
    "react-dom": "19.1.0",
    "react-error-boundary": "^6.0.0",
    "react-hook-form": "^7.61.1",
    "react-resizable-panels": "^3.0.3",
    "recharts": "^2.15.4",
    "server-only": "^0.0.1",
    "sonner": "^2.0.6",
    "superjson": "^2.2.2",
    "tailwind-merge": "^3.3.1",
    "vaul": "^1.1.2",
    "zod": "^4.0.10"
  },
  "devDependencies": {
    "@eslint/eslintrc": "^3",
    "@tailwindcss/postcss": "^4",
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "drizzle-kit": "^0.31.4",
    "eslint": "^9",
    "eslint-config-next": "15.4.4",
    "tailwindcss": "^4",
    "tsx": "^4.20.3",
    "tw-animate-css": "^1.3.6",
    "typescript": "^5"
  }
}