Use hono as backend

README.md

@@ -28,10 +28,7 @@ deno run -A page.tsx
 /** @jsxImportSource https://esm.sh/preact@10.27.2 */
 // deno-lint-ignore-file no-import-prefix
 import { useEffect, useState } from "https://esm.sh/preact@10.27.2/hooks";
-import {
-  defineApi,
-  serve,
-} from "https://esm.sh/jsr/@d2verb/pera?deps=preact@10.27.2";
+import { serve } from "https://esm.sh/jsr/@d2verb/pera?deps=preact@10.27.2";
 
 type Props = { initial?: number };
 
@@ -77,11 +74,12 @@ await serve(App, {
   title: "Counter Sample",
   moduleUrl: import.meta.url,
   props: { initial: 4 },
-  api: defineApi({
-    "/users/:name": {
-      GET: (_, ctx) => new Response(`Hello, ${ctx.params.name}!`),
-    },
-  }),
+  api: (app) => {
+    app.get(
+      "/users/:name",
+      (c) => new Response(`Hello, ${c.req.param("name")}!`),
+    );
+  },
 });
 ```
 

deno.json

@@ -17,6 +17,7 @@
   },
   "imports": {
     "@deno/emit": "jsr:@deno/emit@^0.46.0",
+    "@hono/hono": "jsr:@hono/hono@^4.9.10",
     "@std/assert": "jsr:@std/assert@1",
     "@std/async": "jsr:@std/async@^1.0.14",
     "@std/path": "jsr:@std/path@^1.1.2",

examples/counter.tsx

@@ -2,10 +2,7 @@
 // deno-lint-ignore-file no-import-prefix
 // @ts-nocheck The old cached version of the library causes type errors sometimes.
 import { useEffect, useState } from "https://esm.sh/preact@10.27.2/hooks";
-import {
-  defineApi,
-  serve,
-} from "https://esm.sh/jsr/@d2verb/pera?deps=preact@10.27.2";
+import { serve } from "https://esm.sh/jsr/@d2verb/pera?deps=preact@10.27.2";
 
 type Props = { initial?: number };
 
@@ -51,9 +48,10 @@ await serve(App, {
   title: "Counter Sample",
   moduleUrl: import.meta.url,
   props: { initial: 4 },
-  api: defineApi({
-    "/users/:name": {
-      GET: (_, ctx) => new Response(`Hello, ${ctx.params.name}!`),
-    },
-  }),
+  api: (app) => {
+    app.get(
+      "/users/:name",
+      (c) => new Response(`Hello, ${c.req.param("name")}!`),
+    );
+  },
 });

src/mod.ts

@@ -13,17 +13,17 @@ import type { PeraApp, PeraOptions } from "./types.ts";
  * ```
  *
  * @example With API
- * You should use defineApi() to define your API endpoints — it helps TypeScript infer the types of path parameters automatically.
+ * `app` is a Hono app instance. You can use it to define your API endpoints.
  * ```ts
  * await serve(App, {
  *   port: 8080,
  *   moduleUrl: import.meta.url,
- *   api: defineApi({
+ *   api: (app) => {
  *     // The actual path is `/_pera/api/students/:name`
- *     "/students/:name": {
- *       GET: (_, ctx) => new Response(`Hello, ${ctx.params.name}!`),
- *     },
- *   }),
+ *     app.get("/students/:name", (c) =>
+ *       new Response(`Hello, ${c.req.param("name")}!`),
+ *     );
+ *   },
  * });
  * ```
  *
@@ -42,13 +42,4 @@ export async function serve<
   return serveImpl(App, opts);
 }
 
-export type {
-  ApiContext,
-  ApiFn,
-  ApiMap,
-  ApiMethod,
-  ApiMethodMap,
-  PathParams,
-} from "./api.ts";
-export { defineApi } from "./api.ts";
 export type { PeraOptions };