Database diagram in Drizzle Studio

[mwstr]

Implement database diagram view with foreign keys

[CestDiego]

How can we get this working ?

[afogel]

this is actually something that is straightforward to implement using drizzle-dbml-generator and dbml-renderer

// dbml.ts
import { schema } from "@/lib/db/schema";
import { pgGenerate } from "drizzle-dbml-generator";

const out = "./schema.dbml";
const relational = true;
pgGenerate({ schema, out, relational });
console.log("✅ Created the schema.dbml file");
console.log("⏳ Creating the erd.svg file");

Then from the CLI:
bun dbml.ts && bun dbml-renderer -i schema.dbml -o erd.svg

[gnowland]

Pair this with VSCode extension DBML Live Preview. 🚀

[LesserWords]

I would recomend DBML Entity-Relationship Diagrams visualizer as i find it has better flow of use for visualizing schemas. It requires the vscode-dbml to work.

[MariuzM]

I'm getting this error :(

[afogel]

? is your dbml file valid? I haven't used this in a sec, but I know there are potential updates that might impact things. For more help, you'd need to provide more information than just a screenshot.

[wrsrsh]

What's the update on this? Will a schema visualizer be implemented in drizzle-studio sometime in the near future?

[0xFA11]

Just FWIW, this might be useful in this discussion: https://github.com/rphlmr/drizzle-lab

[callumgare]

I made a PR for this so you might want to consider voting that up: #2841

[gunslingor]

Hey guys, I stumbled on this thread and want to say something. I've been using mysql workbench for diagrams for 20 years, it's the only tool that:

allows you to save your complete diagram layout
uses isometric lines (idea for these diagrams and flow charts, which ER is a subset of)
has bidirectional sync
It lacks:

a readable format when saving the file for git.
I haven't used drizzle studio yet but I was excited to see this thread so wanted to provide some input. If it does this, it will be powerful. Off to try drizzle studio.