ryokryok / remix-cloudflare-pages-d1-drizzle

Remix (Vite) for Cloudflare Pages + Cloudflare D1 + Drizzle ORM

It works at Cloudflare Pages.

[https://remix-cloudflare-pages-d1-34w.pages.dev/]

Stacks

• Remix
  • Remix Auth
  • Remix Auth Google
• Vite
• Cloudflare Pages
• Tailwind CSS
• Drizzle ORM

Get Start

pnpx create-remix@latest --template ryokryok/remix-cloudflare-pages-d1-drizzle

Initial Setup

This project requires wrangler.toml for Cloudflare bindings.

mv wrangler.toml.sample wrangler.toml

Database setup of Cloudflare D1.

pnpm db:create

Local database migration with SQL file generated by Drizzle ORM.

pnpm db:init:local

Google Auth setup

Please read Google Identity

and replace example value to your value, at .dev.vars or wrangler.toml.

[vars]
# openssl rand -base64 32
AUTH_SECRET = <YOUR_VALUE>
GOOGLE_CALLBACK_BASE_URL = <YOUR_VALUE> # like "http://localhost:5173" or "https://your-app.pages.dev"
GOOGLE_CLIENT_ID = <YOUR_VALUE>
GOOGLE_CLIENT_SECRET = <YOUR_VALUE>

Development

Run the Vite dev server:

pnpm run dev

To run Wrangler:

pnpm run build
pnpm run start

Typegen

Generate types for your Cloudflare bindings in wrangler.toml:

pnpm run typegen

You will need to rerun typegen whenever you make changes to wrangler.toml.

Deployment

If you did not create database dev-remix-d1, run this command.

pnpm db:create

Remote database migration with SQL file generated by Drizzle ORM.

pnpm db:init:remote

First, build your app for production:

pnpm run build

Then, deploy your app to Cloudflare Pages:

pnpm run deploy

ORM

When you edited app/lib/schema.ts, generate SQL file for generate this command.

pnpm db:generate

and fix SQL path at package.json script.

-    "db:init:local": "wrangler d1 execute dev-remix-d1 --local --file=./drizzle/0000_neat_medusa.sql",
+    "db:init:local": "wrangler d1 execute dev-remix-d1 --local --file=./drizzle/<YOUR_GENERATED_SQL_PATH>",

Update datable.

pnpm db:reset:local
pnpm db:init:local

Notes

Configuration via wrangler.toml is in open beta.

Configuration via wrangler.toml

License

MIT