Drizzle Studio Has a Free Database GUI — Here's How to Browse Your DB Without Leaving VS Code

Drizzle ORM includes a built-in database GUI called Drizzle Studio. Browse, edit, and query your database — no external tools needed.

What is Drizzle Studio?

Drizzle Studio is a web-based database browser that comes free with Drizzle ORM. Run one command and you get a full GUI for your database.

Launch Studio

npx drizzle-kit studio

Opens at https://local.drizzle.studio — connected to your database automatically.

What You Can Do

• Browse all tables and their data
• Filter, sort, and search records
• Edit records inline (click to edit)
• Run raw SQL queries
• View table relationships
• Export data as JSON or CSV

Setting Up Drizzle ORM

bun add drizzle-orm postgres
bun add -d drizzle-kit

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

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

Define Schema

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

export const users = pgTable("users", {
  id: serial("id").primaryKey(),
  name: text("name").notNull(),
  email: text("email").notNull().unique(),
  age: integer("age"),
  isActive: boolean("is_active").default(true),
  createdAt: timestamp("created_at").defaultNow(),
});

export const posts = pgTable("posts", {
  id: serial("id").primaryKey(),
  title: text("title").notNull(),
  content: text("content"),
  authorId: integer("author_id").references(() => users.id),
  publishedAt: timestamp("published_at"),
});

Querying with Drizzle

import { db } from "./db";
import { users, posts } from "./db/schema";
import { eq, gt, like, desc } from "drizzle-orm";

// Select all users
const allUsers = await db.select().from(users);

// Filter
const activeUsers = await db.select().from(users).where(eq(users.isActive, true));

// Join
const usersWithPosts = await db
  .select({
    userName: users.name,
    postTitle: posts.title,
  })
  .from(users)
  .leftJoin(posts, eq(users.id, posts.authorId))
  .orderBy(desc(posts.publishedAt));

// Insert
const newUser = await db.insert(users).values({
  name: "Alice",
  email: "[e-mail]",
  age: 30,
}).returning();

// Update
await db.update(users)
  .set({ isActive: false })
  .where(eq(users.id, 1));

// Delete
await db.delete(users).where(eq(users.id, 1));

Migrations

# Generate migration from schema changes
npx drizzle-kit generate

# Apply migrations
npx drizzle-kit migrate

# Push schema directly (dev only)
npx drizzle-kit push

Drizzle vs Prisma

Feature	Drizzle	Prisma
Query Style	SQL-like	Method chaining
Type Safety	Full	Full
Bundle Size	Tiny	Large
Raw SQL	Natural	prisma.$queryRaw
Studio	Built-in (free)	Built-in (free)
Migrations	SQL files	Prisma format
Edge Runtime	Yes	Limited
Learning Curve	Know SQL = easy	New syntax

Supported Databases

• PostgreSQL (pg, postgres.js, Neon, Supabase, Vercel Postgres)
• MySQL (mysql2, PlanetScale)
• SQLite (better-sqlite3, Bun SQLite, Turso/LibSQL, D1)

---

Need data for your database? Check out my web scraping actors on Apify Store — extract and load data from any website. For custom solutions, email [e-mail].