Example: Nuxt + Nitro + Cloudflare with OpenHub remote bindings
npm install @openhub2/example-cf-nitro-nuxt1. Cloudflare account with:
- D1 database created
- KV namespace created
- R2 bucket created
2. Update wrangler.toml with your binding IDs
``bashFrom monorepo root
pnpm install
Development
$3
`bash
pnpm dev
`$3
1. Deploy to Cloudflare Workers first:
`bash
pnpm build
pnpm deploy
`2. Set environment variables:
`bash
cp .env.example .env
# Edit .env with your deployed URL and secret
`3. Run with remote bindings:
`bash
pnpm dev:remote
`API Endpoints
| Endpoint | Method | Binding | Description |
|----------|--------|---------|-------------|
|
/api/users | GET | D1 | List users from database |
| /api/users | POST | D1 | Create a new user |
| /api/sessions | GET | KV | Get/create session |
| /api/files | GET | R2 | List uploaded files |
| /api/files | POST | R2 | Upload file |Project Structure
`
cf-nitro-nuxt/
├── app.vue # Root component
├── pages/
│ └── index.vue # Home page
├── server/
│ └── api/
│ ├── users.ts # D1 database example
│ ├── session.ts # KV store example
│ └── files.ts # R2 blob example
├── nuxt.config.ts # Nuxt + OpenHub config
├── wrangler.toml # Cloudflare bindings
└── package.json
`How It Works
1.
@openhub2/metaframework-nuxt registers the OpenHub module with Nuxt
2. Module configures @openhub2/runtime-nitro under the hood
3. Runtime registers @openhub2/provider-cloudflare
4. In dev mode with --remote`, bindings proxy to your deployed workerApache-2.0