Drizzle TeamDT
Drizzle Team•3y ago
nils_77339

Setting up Drizzle with Supabase in Next.js App Router

Hey Drizzle Team,
absolutely love what you are building, but i run into a few problems setting it up. I am using Next.js App router and Supabase. This is my current setup:

drizzle.config.ts
import type { Config } from "drizzle-kit";
import * as dotenv from "dotenv";
dotenv.config();

export default {
  schema: "./src/db/schema.ts",
  driver: "pg",
  dbCredentials: {
    connectionString: process.env.DATABASE_URL as string,
  },
} satisfies Config;


/src/app/db/index.ts
import { drizzle } from "drizzle-orm/postgres-js";
import postgres from "postgres";
import * as schema from "./schema";

const connectionString = process.env.DATABASE_URL;
const client = postgres(connectionString as string);

export const db = drizzle(client, {
  schema,
});


/src/app/db/schema.ts
import { pgTable, serial, text, varchar } from "drizzle-orm/pg-core";

export const waitlist = pgTable("waitlist", {
  id: serial("id").primaryKey(),
  email: text("email").unique(),
});


---
Now i want to create a new entry in my db on the click of a button and tried this:

`
"use client";
import React from "react";
import { db } from "@/db/index";
import { waitlist } from "@/db/schema";
import { Button } from "@/components/ui/button";

const Test = () => {
  function insertTest() {
    db.insert(waitlist)
      .values({ email: "test@test.de" })
      .then(() => console.log("inserted"));
  }

  return <Button onClick={insertTest}>Get Started</Button>;
};

export default Test;


But i am always running into this error:
`
./node_modules/postgres/src/index.js:2:0
Module not found: Can't resolve 'fs'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./src/db/index.ts
./src/components/Test.tsx


Any help would be appreciated a lot!! Thank you so much
Was this page helpful?