Get Started with Drizzle and Vercel Postgres

Basic file structure

This is the basic file structure of the project. In the src/db directory, we have table definition in schema.ts. In drizzle folder there are sql migration file and snapshots.

📦 <project root>  ├ 📂 drizzle  ├ 📂 src  │ ├ 📂 db  │ │ └ 📜 schema.ts  │ └ 📜 index.ts  ├ 📜 .env  ├ 📜 drizzle.config.ts  ├ 📜 package.json  └ 📜 tsconfig.json

Step 1 - Install required package

npm i drizzle-orm @vercel/postgres dotenv npm i -D drizzle-kit tsx

yarn add drizzle-orm @vercel/postgres dotenv yarn add -D drizzle-kit tsx

pnpm add drizzle-orm @vercel/postgres dotenv pnpm add -D drizzle-kit tsx

bun add drizzle-orm @vercel/postgres dotenv bun add -D drizzle-kit tsx

Step 2 - Setup connection variables

Create a .env file in the root of your project and add your database connection variable:

POSTGRES_URL=

Step 3 - Connect Drizzle ORM to the database

Create a index.ts file in the src directory and initialize the connection:

import { drizzle } from 'drizzle-orm/vercel-postgres';  const db = drizzle();

If you need to provide your existing driver:

import { sql } from '@vercel/postgres'; import { drizzle } from 'drizzle-orm/vercel-postgres';  const db = drizzle({ client: sql })

Step 4 - Create a table

Create a schema.ts file in the src/db directory and declare your table:

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(), });

Step 5 - Setup Drizzle config file

Drizzle config - a configuration file that is used by Drizzle Kit and contains all the information about your database connection, migration folder and schema files.

Create a drizzle.config.ts file in the root of your project and add the following content:

import 'dotenv/config'; import { defineConfig } from 'drizzle-kit';  export default defineConfig({  out: './drizzle',  schema: './src/db/schema.ts',  dialect: 'postgresql',  dbCredentials: {  url: process.env.POSTGRES_URL!,  }, });

Step 6 - Applying changes to the database

You can directly apply changes to your database using the drizzle-kit push command. This is a convenient method for quickly testing new schema designs or modifications in a local development environment, allowing for rapid iterations without the need to manage migration files:

npx drizzle-kit push

Read more about the push command in documentation.

npx drizzle-kit generate

npx drizzle-kit migrate

Step 7 - Seed and Query the database

import 'dotenv/config'; import { eq } from 'drizzle-orm'; import { drizzle } from 'drizzle-orm/vercel-postgres'; import { usersTable } from './db/schema';  async function main() {  const db = drizzle();   const user: typeof usersTable.$inferInsert = {  name: 'John',  age: 30,  email: '[email protected]',  };   await db.insert(usersTable).values(user);  console.log('New user created!')   const users = await db.select().from(usersTable);  console.log('Getting all users from the database: ', users)  /*  const users: {  id: number;  name: string;  age: number;  email: string;  }[]  */   await db  .update(usersTable)  .set({  age: 31,  })  .where(eq(usersTable.email, user.email));  console.log('User info updated!')   await db.delete(usersTable).where(eq(usersTable.email, user.email));  console.log('User deleted!') }  main();

Step 8 - Run index.ts file

To run any TypeScript files, you have several options, but let’s stick with one: using tsx

You’ve already installed tsx, so we can run our queries now

Run index.ts script

npx tsx src/index.ts

yarn tsx src/index.ts

pnpm tsx src/index.ts

bunx tsx src/index.ts

bun src/index.ts