Drizzle with Vercel Edge Functions
This tutorial demonstrates how to use Drizzle ORM with Vercel Functions in Edge runtime.
- You should have the latest version of Vercel CLI installed.
- You should have an existing Next.js project or create a new one using the following command:
- You should have installed Drizzle ORM and Drizzle kit. You can do this by running the following command:
In case you face the issue with resolving dependencies during installation:
If youโre not using React Native, forcing the installation with --force
or --legacy-peer-deps
should resolve the issue. If you are using React Native, then you need to use the exact version of React which is compatible with your React Native version.
Edge-compatible driver
When using Drizzle ORM with Vercel Edge functions you have to use edge-compatible drivers because the functions run in Edge runtime not in Node.js runtime, so there are some limitations of standard Node.js APIs.
You can choose one of these drivers according to your database dialect:
- Neon serverless driver allows you to query your Neon Postgres databases from serverless and edge environments over HTTP or WebSockets in place of TCP. We recommend using this driver for connecting to
Neon Postgres
. - Vercel Postgres driver is built on top of the
Neon serverless driver
. We recommend using this driver for connecting toVercel Postgres
. - PlanetScale serverless driver allows you access any
MySQL
client and execute queries over an HTTP connection, which is generally not blocked by cloud providers. - libSQL client allows you to access Turso database.
Navigation
- Navigate directly to the Neon Postgres section.
- Navigate directly to the Vercel Postgres section.
- Navigate directly to the PlanetScale section.
- Navigate directly to the Turso section.
Neon Postgres
Install the @neondatabase/serverless
driver
Install the @neondatabase/serverless
driver:
Create a table
Create a schema.ts
file in the src/db
directory and declare a table schema:
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:
Configure your database connection string in the .env
file:
Applying changes to the database
You can generate migrations using drizzle-kit generate
command and then run them using the drizzle-kit migrate
command.
Generate migrations:
These migrations are stored in the drizzle
directory, as specified in your drizzle.config.ts
. This directory will contain the SQL files necessary to update your database schema and a meta
folder for storing snapshots of the schema at different migration stages.
Example of a generated migration:
Run migrations:
Alternatively, you can push changes directly to the database using Drizzle kit push command:
Connect Drizzle ORM to your database
Create a index.ts
file in the src/db
directory and set up your database configuration:
Create an API route
Create route.ts
file in src/app/api/hello
directory. To learn more about how to write a function, see the Functions API Reference and Vercel Functions Quickstart.
Test your code locally
Run the next dev
command to start your local development server:
Navigate to the route you created (e.g. /api/hello)
in your browser:
Deploy your project
Create a new project in the dashboard or run the vercel
command to deploy your project:
Add POSTGRES_URL
environment variable:
Redeploy your project to update your environment variables:
Finally, you can use URL of the deployed project and navigate to the route you created (e.g. /api/hello)
to access your edge function.
Vercel Postgres
You can check quickstart guide for Drizzle with Vercel Postgres client in the documentation.
Install the @vercel/postgres
driver
Install the @vercel/postgres
driver:
Create a table
Create a schema.ts
file in the src/db
directory and declare a table schema:
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:
Configure your database connection string in the .env
file:
Applying changes to the database
You can generate migrations using drizzle-kit generate
command and then run them using the drizzle-kit migrate
command.
Generate migrations:
These migrations are stored in the drizzle
directory, as specified in your drizzle.config.ts
. This directory will contain the SQL files necessary to update your database schema and a meta
folder for storing snapshots of the schema at different migration stages.
Example of a generated migration:
Run migrations:
Alternatively, you can push changes directly to the database using Drizzle kit push command:
Connect Drizzle ORM to your database
Create a index.ts
file in the src/db
directory and set up your database configuration:
Create an API route
Create route.ts
in src/app/api/hello
directory. To learn more about how to write a function, see the Functions API Reference and Vercel Functions Quickstart.
Test your code locally
Run the next dev
command to start your local development server:
Navigate to the route you created (e.g. /api/hello)
in your browser:
Deploy your project
Create a new project in the dashboard or run the vercel
command to deploy your project:
Add POSTGRES_URL
environment variable:
Redeploy your project to update your environment variables:
Finally, you can use URL of the deployed project and navigate to the route you created (e.g. /api/hello)
to access your edge function.
PlanetScale
In this tutorial we use PlanetScale MySQL.
Install the @planetscale/database
driver
Install the @planetscale/database
driver:
Create a table
Create a schema.ts
file in the src/db
directory and declare a table schema:
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:
Configure your database connection string in the .env
file:
Applying changes to the database
You can generate migrations using drizzle-kit generate
command and then run them using the drizzle-kit migrate
command.
Generate migrations:
These migrations are stored in the drizzle
directory, as specified in your drizzle.config.ts
. This directory will contain the SQL files necessary to update your database schema and a meta
folder for storing snapshots of the schema at different migration stages.
Example of a generated migration:
Run migrations:
Alternatively, you can push changes directly to the database using Drizzle kit push command:
Connect Drizzle ORM to your database
Create a index.ts
file in the src/db
directory and set up your database configuration:
Create an API route
Create route.ts
in src/app/api/hello
directory. To learn more about how to write a function, see the Functions API Reference and Vercel Functions Quickstart.
Test your code locally
Run the next dev
command to start your local development server:
Navigate to the route you created (e.g. /api/hello)
in your browser:
Deploy your project
Create a new project in the dashboard or run the vercel
command to deploy your project:
Add MYSQL_URL
environment variable:
Redeploy your project to update your environment variables:
Finally, you can use URL of the deployed project and navigate to the route you created (e.g. /api/hello)
to access your edge function.
Turso
You can check quickstart guide or tutorial for Drizzle with Turso in the documentation.
Install the @libsql/client
driver
Install the @libsql/client
driver:
Create a table
Create a schema.ts
file in the src/db
directory and declare a table schema:
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:
Configure your database connection string and auth token in the .env
file:
Applying changes to the database
You can generate migrations using drizzle-kit generate
command and then run them using the drizzle-kit migrate
command.
Generate migrations:
These migrations are stored in the drizzle
directory, as specified in your drizzle.config.ts
. This directory will contain the SQL files necessary to update your database schema and a meta
folder for storing snapshots of the schema at different migration stages.
Example of a generated migration:
Run migrations:
Alternatively, you can push changes directly to the database using Drizzle kit push command:
Connect Drizzle ORM to your database
Create a index.ts
file in the src/db
directory and set up your database configuration:
Create an API route
Create route.ts
in src/app/api/hello
directory. To learn more about how to write a function, see the Functions API Reference and Vercel Functions Quickstart.
Test your code locally
Run the next dev
command to start your local development server:
Navigate to the route you created (e.g. /api/hello)
in your browser:
Deploy your project
Create a new project in the dashboard or run the vercel
command to deploy your project:
Add TURSO_CONNECTION_URL
environment variable:
Add TURSO_AUTH_TOKEN
environment variable:
Redeploy your project to update your environment variables:
Finally, you can use URL of the deployed project and navigate to the route you created (e.g. /api/hello)
to access your edge function.