> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dbhost.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Next.js Drizzle Quickstart

> Connect a Next.js app to DBHost with Drizzle ORM and query PostgreSQL through the pooled database URL.

If you want PostgreSQL in Next.js without a heavier ORM layer, Drizzle is the clean middle path: typed schema, typed queries, and SQL that still feels close to the database.

This quickstart keeps to the shortest useful path: one DBHost database, one Drizzle setup, and one server-side query.

**Best fit:** Teams that want type-safe SQL, explicit schema files, and a lighter abstraction than Prisma.

**Not for:** Teams that want full ORM modeling, or teams that want zero schema tooling and prefer plain SQL only.

If you want to compare this path with Prisma or plain `pg`, start with the [Next.js + PostgreSQL guide](/guides/nextjs-postgres).

## What you need

* A DBHost account and one active database
* A Next.js app
* Node.js 18 or later
* Drizzle ORM, `pg`, and Drizzle Kit installed in the app

<Note>
  DBHost exposes PostgreSQL through PgBouncer on port `6432`. That pooled
  connection string is the default path for normal Drizzle app queries.
</Note>

## 1. Create a database in DBHost

Create a database from the dashboard, then copy the connection string from the database detail page.

If you are starting from zero, that is still the fastest first step. DBHost gives you the host, port, username, and password before you touch schema files or query code.

## 2. Install Drizzle

From your Next.js project:

```bash theme={null}
npm install drizzle-orm pg
npm install -D drizzle-kit @types/pg
```

## 3. Point Drizzle at DBHost

Add the DBHost connection string to `.env.local` or the environment file your app already uses:

```bash theme={null}
DATABASE_URL="postgresql://uabc123_my_project:PASSWORD@db.dbhost.app:6432/uabc123_my_project?sslmode=verify-full"
```

Use the exact connection details from DBHost.

## 4. Add the Drizzle config and schema

```ts theme={null}
// drizzle.config.ts
import "dotenv/config";
import { defineConfig } from "drizzle-kit";

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

```ts theme={null}
// app/lib/schema.ts
import { pgTable, serial, text, timestamp } from "drizzle-orm/pg-core";

export const projects = pgTable("projects", {
  id: serial("id").primaryKey(),
  name: text("name").notNull(),
  createdAt: timestamp("created_at", { withTimezone: true })
    .defaultNow()
    .notNull(),
});
```

That is enough schema to prove the full path works.

## 5. Push the schema

For a quickstart, pushing is enough:

```bash theme={null}
npx drizzle-kit push
```

If your team already uses migration files, keep that workflow. Drizzle also supports `generate` and `migrate` when you want reviewed SQL migrations in source control.

## 6. Create a reusable database client

Use one shared `pg` pool and hand it to Drizzle:

```ts theme={null}
// app/lib/db.ts
import { drizzle } from "drizzle-orm/node-postgres";
import { Pool } from "pg";
import * as schema from "./schema";

const globalForDb = globalThis as unknown as {
  pool?: Pool;
};

const pool =
  globalForDb.pool ??
  new Pool({
    connectionString: process.env.DATABASE_URL,
  });

if (process.env.NODE_ENV !== "production") {
  globalForDb.pool = pool;
}

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

This keeps development refreshes from creating a new connection pool every time the module reloads.

## 7. Query from a server component

```tsx theme={null}
// app/page.tsx
import { desc } from "drizzle-orm";
import { db } from "./lib/db";
import { projects } from "./lib/schema";

export default async function HomePage() {
  const rows = await db
    .select()
    .from(projects)
    .orderBy(desc(projects.createdAt))
    .limit(5);

  return (
    <main>
      <h1>Projects</h1>
      <ul>
        {rows.map((project) => (
          <li key={project.id}>{project.name}</li>
        ))}
      </ul>
    </main>
  );
}
```

That is enough to verify the database connection, Drizzle schema, and Next.js render path in one pass.

## When DBHost helps most

* You want PostgreSQL working with Drizzle without managing PgBouncer yourself
* You want one pooled URL ready on day one
* You want backups and password resets from the dashboard later
* You want the option to automate database actions through the published CLI or REST API

## Next steps

<Columns cols={2}>
  <Card title="Start for Free" icon="rocket" href="https://dbhost.app/sign-up?utm_source=docs&utm_medium=guide&utm_campaign=nextjs_drizzle&utm_content=start_for_free">
    Create a DBHost account and provision your first database.
  </Card>

  <Card title="Compare Next.js Paths" icon="layers" href="/guides/nextjs-postgres">
    See when Drizzle, Prisma, or plain `pg` is the better fit for your app.
  </Card>
</Columns>

* See the [DBHost quickstart](/quickstart) for the shortest path to your first database.
* See the [Next.js + PostgreSQL guide](/guides/nextjs-postgres) if you want to compare Drizzle with Prisma or plain `pg`.
* See the [CLI](/cli) if you want to script database actions from your terminal.
* See the [API reference](/api-reference/introduction) if your deployment pipeline already speaks HTTP.
