I am trying to follow the instructions
I am trying to follow the instructions and set up this DB environment variable in my nextjs app but I am stuck at the very first step.
5 Replies
The d1 package you are trying to use is deprecated. Since you are using Next.js, I am assuming that you are using Pages functions? If that's the case, maybe this doc can help: https://developers.cloudflare.com/pages/functions/bindings/#d1-databases
Cloudflare Docs
Bindings · Cloudflare Pages docs
A binding enables your Pages Functions to interact with resources on the Cloudflare developer platform. Use bindings to integrate your Pages Functions …
thanks, let me try and follow the steps mentioned here.
This page does talk about bindings and shares basic typescript code for interacting with the database, however, it doesn't share any info about the use of d1 db within a nextjs app. So, do you have some reference or doc showing this?
One approach can be -- have a standalone app generated via wrangler and deploy it as a separate worker on cloudflare and have all the db logic there exposing the same as APIs. And, my nextjs app (a different worker on cloudflare) can then interact with the db via this wrangler generated standalone project.
However, I will still prefer to have everything inside my one nextjs app.
Just saw your code snippet. You are using a deprecated library for D1. To use D1 in your Next.js app, as mentioned in the doc above, you need to add the binding to your
wrangler.toml file. Then you need to add the interface, and then you can pass on the binding using the getRequestContext method from the @cloudflare/next-on-pages package.
Here's the doc that should help: https://developers.cloudflare.com/pages/framework-guides/nextjs/deploy-a-nextjs-site/#add-bindings-to-typescript-projectsCloudflare Docs
Full-stack deployment · Cloudflare Pages docs
Deploy a full-stack Next.js site (recommended).
awesome, this finally worked. Minor comment to improve the doc a bit. This doesn't say how to declare the DB type clearly. I got this error Type error: Property 'DB' does not exist on type 'CloudflareEnv' initially but I got past it eventually.
Tnx for the help!
Also, for previewing the app locally, the doc says to run this
npx wrangler pages dev .vercel/output/static However, the normal npm run dev worked fine for me. I was able to interact with the db with no problems.Glad that is working. Thank you for the feedback. Let me figure out where would be the best place to make this changes 😄