mount() to embed other frameworks
Use app.mount(path, handler) to mount applications built with other frameworks (like itty-router) into a Hono application. Example: app.mount('/itty-router', ittyRouter.handle)
app
149 notes in this subject, read out of this brain and free to use. This is page 1 of 3.
fire() method deprecated
app.fire() is deprecated and should not be used. Use fire() from hono/service-worker instead for Service Worker environments.
Hono app instance methods
An instance of Hono has the following methods: HTTP_METHOD (e.g., get, post), all, on, use, route, basePath, notFound, onError, mount, fire, fetch, and request.
fetch() method as application entry point
app.fetch is the entry point of a Hono application. For Cloudflare Workers, export an object with a fetch method that calls app.fetch(request, env, ctx), or simply export the app directly. For Bun, export an object with port and fetch properties where fetch is app.fetch.
strict mode for route matching
Strict mode defaults to true and distinguishes between routes with and without trailing slashes (e.g., /hello vs /hello/). Set strict mode to false with `new Hono({ strict: false })` to treat both paths equally.
notFound handler customization
Use app.notFound to customize a Not Found response. The notFound method receives a context parameter and should return a Response. Example: app.notFound((c) => { return c.text('Custom 404 Message', 404) }). Note: notFound is only called from the top-level app, not from mounted sub-apps.
request() method for testing
Use app.request() for testing. It accepts a URL/pathname for GET requests or a Request object for other methods, and returns a Response object. Example: const res = await app.request('/hello'); or const res = await app.request(new Request('...', { method: 'POST' }));
router option to specify router implementation
The router option specifies which router to use. Default is SmartRouter. To use RegExpRouter instead, pass it when creating the app: `new Hono({ router: new RegExpRouter() })`
Hono app basic setup and export
Import Hono, create a new instance with `const app = new Hono()`, then export it as `export default app` for Cloudflare Workers or Bun.
Generics for type safety with Bindings and Variables
Pass generics to Hono to specify types for Cloudflare Workers Bindings and variables used with c.set/c.get. Example: `new Hono<{ Bindings: { TOKEN: string }, Variables: { user: User } }>()`. This provides type safety when accessing c.env.TOKEN and c.set('user', user).
onError handler for uncaught exceptions
Use app.onError to handle uncaught errors and return a custom Response. The handler receives an error and context parameter. Example: app.onError((err, c) => { console.error(`${err}`); return c.text('Custom Error Message', 500) }). Route-level onError handlers take priority over parent app handlers.
Hono runs on multiple runtimes
Hono works on Cloudflare Workers, Deno, Bun, and Node.js through an adapter. This multi-runtime support means Hono is not limited to a single JavaScript runtime.
Hono has ecosystem of community middleware and features
Hono has an ecosystem including middleware for Basic authentication, GraphQL servers, Firebase authentication, Sentry middleware, and a Node.js adapter.
Hono uses only Web Standard APIs
Hono is built using only Web Standard APIs, which enables it to work across multiple runtimes including Deno and Bun.
Hono core characteristics
Hono is characterized as being very fast, capable of making many things possible, and working across different runtimes. The vision is for Hono to become the standard for Web Standards.
Hono created for Cloudflare Workers
Hono was started because there was no good framework that worked on Cloudflare Workers. The original motivation was to create a web application on Cloudflare Workers.
Hono runtimes supported
Hono runs on Cloudflare Workers (workerd), Deno, Bun, Fastly Compute, AWS Lambda, Node.js, Vercel (edge-light), and WebAssembly (with WebAssembly System Interface (WASI) via wasi:http). It also works on Netlify and other platforms. The same code runs on all platforms.
Basic Hono server example for Web Standards runtimes
A Hono server that returns 'Hello World' can be written as an export default object with an async fetch function that returns new Response('Hello World'). This code runs on Cloudflare Workers and Bun.
Web Standards enable Hono portability
Because Hono uses only Web Standards, Hono can run on any runtime that supports them. Cloudflare Workers, Deno, and Bun are built upon Web Standards.
serverless-devs configuration for Alibaba Cloud
Use serverless-devs as the deployment tool. Run npx s config add and select Alibaba Cloud (alibaba), then input your AccessKeyID and AccessKeySecret.
Hono hello world on Alibaba Cloud Function Compute
Create src/index.ts with: import { Hono } from 'hono'; import { handle } from 'hono-alibaba-cloud-fc3-adapter'; const app = new Hono(); app.get('/', (c) => c.text('Hello Hono!')); export const handler = handle(app);
Alibaba Cloud Function Compute s.yaml configuration
Configure s.yaml with edition 3.0.0, name, access default, and a resources section containing my-app component fc3. Props include: region (default us-west-1), functionName, description, runtime nodejs20, code ./dist, handler index.handler, memorySize 1024, timeout 300.
Alibaba Cloud Function Compute build and deploy scripts
In package.json scripts, add: build - esbuild --bundle --outfile=./dist/index.js --platform=node --target=node20 ./src/index.ts, and deploy - s deploy -y. Run npm run build to compile TypeScript, then npm run deploy to deploy to Alibaba Cloud.
Hono on Alibaba Cloud Function Compute - setup
To run Hono on Alibaba Cloud Function Compute, use the third-party adapter rwv/hono-alibaba-cloud-fc3-adapter. Install with: npm i hono hono-alibaba-cloud-fc3-adapter. Also install @serverless-devs/s and esbuild as dev dependencies. Create a src/ directory and src/index.ts file.
Azure Functions Hono app structure
Create src/app.ts with a Hono app instance. Create src/functions/httpTrigger.ts that imports azureHonoHandler from @marplex/hono-azurefunc-adapter and the honoApp, then passes honoApp.fetch to azureHonoHandler.
Azure Functions adapter package
The package @marplex/hono-azurefunc-adapter enables Hono to run on Azure Functions. It is installed alongside hono.
Azure Functions runtime requirements
Hono runs on Azure Functions V4 with Node.js 18 or above.
Azure Functions Hono deployment command
Deploy a Hono app to Azure Functions using: func azure functionapp publish <YourFunctionAppName>, where <YourFunctionAppName> is the name of your function app in Azure.
Azure Functions local development server port
When running the development server locally with npm run start (or equivalent in other package managers), the server is accessible at http://localhost:7071.
Azure Functions HTTP trigger setup example
import { app } from '@azure/functions' import { azureHonoHandler } from '@marplex/hono-azurefunc-adapter' import honoApp from '../app' app.http('httpTrigger', { methods: [ 'GET', 'POST', 'DELETE', 'PUT', ], authLevel: 'anonymous', route: '{*proxy}', handler: azureHonoHandler(honoApp.fetch), }) This example shows setting up an HTTP trigger with the Hono adapter, specifying supported methods, auth level, route pattern, and the Hono handler.
Azure Functions Hono hello world example
import { Hono } from 'hono' const app = new Hono() app.get('/', (c) => c.text('Hello Azure Functions!')) export default app This example shows a basic Hono app for Azure Functions with a single GET route at the root path.
Same code runs on all runtimes
The same Hono application code works on any runtime including Cloudflare Workers, Deno, Bun, Node and others. Only the import and export statements may vary by runtime.
Development server port
When running the development server locally with Cloudflare Workers template, the default access URL is http://localhost:8787.
Platform adapters
Hono provides adapters for platform-dependent functions. For example, `hono/cloudflare-workers` provides adapters like `upgradeWebSocket` for handling WebSocket connections on Cloudflare Workers.
Hello World Hono application
A basic Hono application is created by importing Hono, creating an app instance with `const app = new Hono()`, defining a route with `app.get('/', (c) => c.text('Hello Hono!'))`, and exporting the app with `export default app`. The import and export statements may vary by runtime, but the application code is the same across all runtimes.
Available starter templates
The following templates are available when creating a Hono project: aws-lambda, bun, cloudflare-pages, cloudflare-workers, deno, fastly, nextjs, nodejs, and vercel.
Create a new Hono project with deno
Run `deno init --npm hono@latest my-app` to create a new Hono project using deno.
Create a new Hono project with bun
Run `bun create hono@latest my-app` to create a new Hono project using bun.
Create a new Hono project with yarn
Run `yarn create hono my-app` to create a new Hono project using yarn.
Example: X-Response-Time middleware
app.use(async (c, next) => { const start = performance.now() await next() const end = performance.now() c.res.headers.set('X-Response-Time', `${end - start}`) }) This example demonstrates measuring the time taken to handle a request and adding it as a response header.
Middleware signature with async/await
Middleware is registered with app.use() and receives a context object c and a next function. The middleware should be async and call await next() to pass control to the next handler. After next() completes, the middleware can modify the response before it is sent.
Middleware definition and onion structure
Middleware is executed before and after the Handler and handles the Request and Response. The architecture follows an onion structure.
Change port number on Bun
Instead of exporting the app directly, export an object with a port property and fetch method: `export default { port: 3000, fetch: app.fetch }`.
Bun Hello World example
Import Hono, create an app instance, define a GET route on the root path, and export the app by default. The bun run dev command expects the script in src/index.ts and serves on http://localhost:3000 by default. ```ts import { Hono } from 'hono' const app = new Hono() app.get('/', (c) => c.text('Hello Bun!')) export default app ```
Bun testing with bun:test
Use the bun:test module to test Hono apps on Bun. Import describe, expect, and it from 'bun:test', then create a Request object and call app.fetch() to test the endpoint. Run tests with `bun test filename.test.ts`. ```ts import { describe, expect, it } from 'bun:test' import app from '.' describe('My first test', () => { it('Should return 200 Response', async () => { const req = new Request('http://localhost/') const res = await app.fetch(req) expect(res.status).toBe(200) }) }) ```
Add Hono to existing Bun project
To add Hono to an existing Bun project, run `bun add hono` in the project root directory, then add a dev script to package.json: `"dev": "bun run --hot src/index.ts"`.
Bun runtime setup with Hono
Create a new Hono project for Bun using `bun create hono@latest my-app`. Then run `cd my-app` and `bun install` to install dependencies.
Deploy Cloudflare Workers app with Vite
Deploy to Cloudflare using npm run deploy, yarn deploy, pnpm run deploy, or bun run deploy. The deploy script builds with Vite and publishes with Wrangler.
Generate types for Cloudflare Bindings with cf-typegen
Run npm run cf-typegen, yarn cf-typegen, pnpm run cf-typegen, or bun run cf-typegen to generate types for Cloudflare Bindings. This creates a CloudflareBindings interface that can be passed to Hono as generics.
Configure Cloudflare Bindings in wrangler.jsonc
Bindings like Variables, KV, D1, and others are configured in wrangler.jsonc. Example for a Variable named MY_NAME: { "$schema": "node_modules/wrangler/config-schema.json", "name": "my-app", "compatibility_date": "2025-08-03", "main": "./src/index.tsx", "vars": { "MY_NAME": "Hono" } }
Cloudflare Workers + Vite setup with create-hono
Start a Cloudflare Workers project with Vite using the create-hono command. Select the cloudflare-workers+vite template. Commands: npm create hono@latest my-app, yarn create hono my-app, pnpm create hono my-app, bun create hono@latest my-app, or deno init --npm hono my-app.
Development server for Cloudflare Workers + Vite
Run the development server with npm run dev, yarn dev, pnpm dev, or bun run dev. Access the application at http://localhost:5173 in a web browser.
Hello World Hono app on Cloudflare Workers
A basic Hono app on Cloudflare Workers with JSX rendering: import { Hono } from 'hono'; import { renderer } from './renderer'; const app = new Hono(); app.use(renderer); app.get('/', (c) => { return c.render(<h1>Hello, Cloudflare Workers!</h1>) }); export default app
Hono JSX renderer with vite-ssr-components setup
The renderer uses jsxRenderer from hono/jsx-renderer together with vite-ssr-components components Link and ViteClient. Example: import { jsxRenderer } from 'hono/jsx-renderer'; import { Link, ViteClient } from 'vite-ssr-components/hono'; export const renderer = jsxRenderer(({ children }) => { return (<html><head><ViteClient /><Link href='/src/style.css' rel='stylesheet' /></head><body>{children}</body></html>) })
vite.config.ts for Cloudflare Workers with Hono JSX
The vite configuration combines the Cloudflare plugin with vite-ssr-components for SSR: import { cloudflare } from '@cloudflare/vite-plugin'; import { defineConfig } from 'vite'; import ssrPlugin from 'vite-ssr-components/plugin'; export default defineConfig({ plugins: [cloudflare(), ssrPlugin()], })
Cloudflare Workers + Vite directory structure
The starter project has the following structure: ./package.json, ./public (for static files), ./src/index.tsx (server-side entry point), ./src/renderer.tsx, ./src/style.css, ./tsconfig.json, ./vite.config.ts, and ./wrangler.jsonc.
Client-side scripts with vite-ssr-components Script component
Use the Script component from vite-ssr-components to load client-side scripts through Vite. Vite handles bundling for both dev and production. Example: import { Script, ViteClient } from 'vite-ssr-components/hono'; export const renderer = jsxRenderer(({ children }) => { return (<html><head><ViteClient /><Script src='/src/client.ts' /></head><body>{children}</body></html>) })
TypeScript support across runtimes
Hono enables writing applications for Cloudflare Workers, Deno, and Bun in TypeScript without needing to transpile to JavaScript. Hono itself is written in TypeScript and can make applications type-safe.
Cloudflare Pages directory structure
A Cloudflare Pages project has the following directory structure: package.json at root, public/static/ for static files accessible as /static/*, src/index.tsx as the server-side entry point, src/renderer.tsx for rendering, tsconfig.json, and vite.config.ts for build configuration.
Cloudflare Pages setup with create-hono command
To start a new Cloudflare Pages project with Hono, use the 'create-hono' command and select the 'cloudflare-pages' template. Run 'npm create hono@latest my-app' (or equivalent for yarn, pnpm, bun, deno), then cd into the directory and install dependencies with the package manager's install command.