lifetracker/apps/docs/docs/how-i-built-this/04-babys-first-schema.md

description
Time for some actual functionality, believe it or not.

Baby's First Schema

Unsurprisingly, this takes place in the database part of the project, which is packages/db.

The idea will be to define a new file, day.ts, in packages/db/schema/, and put the columns and constraints in there.

If I'm understanding correctly, a difference vs. Phoenix or Rails is that you don't have to write the migrations yourself: just edit the schema file and you can drizzle-kit generate the migrations straight out of the single file. Plus, it'll walk you through which columns you want to rename, which you want to make new, etc. Slick.

But first, a detour...

I guess last time I had set up a schema in packages/db/schema.ts, and the migrations were in packages/db/drizzle -- I felt it was better to rename these:

• Schemas in their own directory (schema)
• Migrations called migrations, not drizzle

These changes required editing the front matter of a few Drizzle ts files, which I'm sure you can figure out for yourself.

Then I edited day.ts and prepared to generate and run the migrations.

This was the harder part that I do want to document:

1. Why won't the db generate command work

After changing the "events" schema I had started with last time to a "days" schema -- mainly to see if the db could migrate from one schema to another conflicting one -- I wasn't able to run the generate command:

pnpm drizzle-kit generate

drizzle-kit wasn't in the PATH, which was actually irrelevant, because I wanted to invoke this using pnpm db:generate the way I was able to run pnpm db:migrate and pnpm db:studio. Why wasn't it working?

The answer involved two steps. First, I had to add in packages/db/package.json a script:

    "scripts": {
        "generate": "drizzle-kit generate"
    }

which was obvious. What was NOT obvious was that the db:___ syntax wasn't filtering into the db package for me, it was just already defined for migrate and studio in the root level package.json. Added db:generate in there and everything worked great.

"scripts": {
    "build": "turbo build",
    "dev": "turbo dev",
    ...
    "db:generate": "pnpm --filter @lifetracker/db generate",

Now, why not have this somehow alias to the one in the packages/db/package.json file? IDK, but the migrate and studio ones were written this way, so fuck it.

2. Adding "db:studio" to the dev pipeline in Turbo

With the migration ostensibly done, I wanted to see the glorious new table definition in the Drizzle Studio, but despite having run pnpm run dev, it wasn't running. How could I get it to run alongside?

This was pretty cool. I changed this in turbo.json at the project root:

"dev": {
      "dependsOn": ["^dev"], # This is the key
      "cache": false,
      "persistent": true
    }

... and in the db package's package.json, I added:

"scripts": {
 ...
    "dev": "drizzle-kit studio",
 ...
}

This means that now when I run "pnpm dev" from the project root, along with Docusaurus (this shit) and the actual web app, I get the Drizzle Studio page simultaneously. So cool!

Can we actually do something now?

Almost! Next snag: Trying to add @lifetracker/db as a dependency in the @lifetracker/web app, I realize I could just manually add it in the package.json, but ChatGPT suggested I run this command:

$ pnpm --filter=@lifetracker/web add @lifetracker/db

ERR_PNPM_FETCH_404  GET https://registry.npmjs.org/@lifetracker%2Fdb: Not Found - 404

This error happened while installing a direct dependency of /home/ryan/Documents/Code/lifetracker/apps/web

@lifetracker/db is not in the npm registry, or you have no permission to fetch it.

So, to fix this... you actually have to run

pnpm --filter=@lifetracker/web add @lifetracker/db@workspace:*

which is also why in the manually defined lines I had copied over into the package.json, it was written as:

    "@lifetracker/db": "workspace:*^*",

This made it work fine.