wrangler-studio

Cloudflare-native admin UI for D1, KV, R2, Durable Objects, and better-auth data

Wrangler Studio is a Cloudflare-native admin surface for D1, KV, R2, Durable Objects, and better-auth data that runs inside your Worker.

Install

npm install wrangler-studio

Your Worker needs a D1 binding named DB.

Canonical API

Prefer the named exports:

import { createStudioApp, studio } from 'wrangler-studio'

The package still ships a default export for compatibility, but named exports are the intended long-term API.

Standalone Worker

import { basicAuth, createStudioApp } from 'wrangler-studio'

export default {
  fetch(request: Request, env: { DB: D1Database }) {
    const app = createStudioApp({
      db: env.DB,
      auth: basicAuth('admin', 'change-me'),
    })

    return app.fetch(request, env)
  },
}

Mounted Hono app

import { Hono } from 'hono'
import { basicAuth, studio } from 'wrangler-studio'

const app = new Hono<{ Bindings: { DB: D1Database } }>()

app.route('/studio', studio((env) => ({
  db: env.DB,
  auth: basicAuth('admin', 'change-me'),
})))

export default app

Permissions, sections, and hooks

import {
  basicAuth,
  createStudioApp,
  disableSections,
  permissions,
  viewerPermissions,
} from 'wrangler-studio'

const app = createStudioApp({
  db: env.DB,
  auth: basicAuth('admin', 'change-me'),
  sections: disableSections('do'),
  permissions: permissions({ default: viewerPermissions() }),
  hooks: {
    redactFields: ({ resourceType }) => resourceType === 'table' ? ['email'] : ['token', 'secret'],
    audit: (event) => console.log('studio audit', event),
  },
})

Production guidance

• Always enable auth in shared or deployed environments.
• Prefer binding credentials from environment variables instead of hardcoding them.
• Start with read-only permissions and enable writes deliberately.
• Use section toggles to disable panes you do not want exposed.
• Use redaction hooks for customer data, secrets, tokens, cookies, and internal identifiers.
• Use audit hooks for destructive actions.
• Mount Wrangler Studio behind your existing Hono auth or network controls when possible.

Examples

See:

• examples/worker.ts
• examples/hono.ts
• examples/hooks.ts

Features

• D1 table browsing, schema inspection, inline row edits, inserts, deletes, and seed helpers
• better-auth user, session, account, and organization management
• KV namespace browsing
• R2 object browsing and metadata inspection
• Durable Object namespace inspection
• Section gating, permission enforcement, redaction hooks, and audit hooks

FAQ

License

MIT