Introduction

# .env.local (client)
VITE_CIPH_SECRET=your-32-char-minimum-secret-here

# .env (server)  
CIPH_SECRET=your-32-char-minimum-secret-here

pnpm add @ciph/core @ciph/client axios
# or
npm install @ciph/core @ciph/client axios

pnpm add @ciph/core @ciph/hono hono

// lib/ciph.ts
import { createClient } from "@ciph/client"

export const ciph = createClient({
  baseURL: import.meta.env.VITE_API_URL,
  secret: import.meta.env.VITE_CIPH_SECRET,
})

// services/materials.ts
import { ciph } from "@/lib/ciph"

// GET (no body encryption, fingerprint header only)
export const listMaterials = async () => {
  const res = await ciph.get("/materials")
  return res.data
}

// POST (body auto-encrypted)
export const createMaterial = async (payload: CreateMaterialDto) => {
  const res = await ciph.post("/materials", payload)
  return res.data
}

// server.ts
import { Hono } from "hono"
import { ciph } from "@ciph/hono"

const app = new Hono()

app.use("*", ciph({
  secret: process.env.CIPH_SECRET!,
}))

app.get("/materials", async (c) => {
  // c.req.json() returns plain object (already decrypted)
  const materials = await db.materials.findMany()
  return c.json({ data: materials }) // auto-encrypted before send
})

export default app

// App.tsx
import { CiphDevtools } from "@ciph/devtools-client"

function App() {
  return (
    <>
      <YourApp />
      <CiphDevtools /> {/* vanishes in production */}
    </>
  )
}

// After ciph middleware
app.route("/ciph", ciphDevServer({ secret: process.env.CIPH_SECRET! }))