DEV Community

Atlas Whoff
Atlas Whoff

Posted on

Hono.js: The Fastest Web Framework for Edge and Serverless Environments

#webdev #node #javascript #typescript

Hono.js: The Fastest Web Framework for Edge and Serverless Environments

Express is 15 years old and doesn't run on the Edge. Hono does.
Ultra-fast, tiny, TypeScript-first. Here's why it's worth switching.

Why Hono

  • Runs anywhere: Node.js, Cloudflare Workers, Deno, Bun, AWS Lambda
  • ~14KB bundle size
  • TypeScript-first with end-to-end type safety via RPC
  • Built-in middleware: CORS, JWT, rate limiting, caching
  • Express-like API — easy to migrate

Basic Setup 

npm install hono
Enter fullscreen mode Exit fullscreen mode 
import { Hono } from 'hono'
import { serve } from '@hono/node-server'

const app = new Hono()

app.get('/', (c) => c.json({ message: 'Hello from Hono!' }))

app.get('/users/:id', async (c) => {
  const id = c.req.param('id')
  const user = await getUserById(id)
  if (!user) return c.json({ error: 'Not found' }, 404)
  return c.json(user)
})

app.post('/users', async (c) => {
  const body = await c.req.json<{ name: string; email: string }>()
  const user = await createUser(body)
  return c.json(user, 201)
})

serve({ fetch: app.fetch, port: 3000 })
Enter fullscreen mode Exit fullscreen mode

Routing and Middleware 

import { Hono } from 'hono'
import { cors } from 'hono/cors'
import { jwt } from 'hono/jwt'
import { logger } from 'hono/logger'
import { rateLimiter } from 'hono-rate-limiter'

const app = new Hono()

// Global middleware
app.use('*', logger())
app.use('*', cors({ origin: 'https://myapp.com' }))

// Protected routes
const api = new Hono()
api.use('*', jwt({ secret: process.env.JWT_SECRET! }))

api.get('/profile', (c) => {
  const payload = c.get('jwtPayload')
  return c.json({ userId: payload.sub })
})

app.route('/api', api)
Enter fullscreen mode Exit fullscreen mode

Zod Validation 

import { zValidator } from '@hono/zod-validator'
import { z } from 'zod'

const CreateUserSchema = z.object({
  name: z.string().min(1),
  email: z.string().email(),
})

app.post(
  '/users',
  zValidator('json', CreateUserSchema),
  async (c) => {
    const { name, email } = c.req.valid('json')
    // name and email are fully typed
    const user = await createUser({ name, email })
    return c.json(user, 201)
  }
)
Enter fullscreen mode Exit fullscreen mode

Hono RPC (End-to-End Type Safety) 

// server/routes/users.ts
const usersRoute = new Hono()
  .get('/:id', async (c) => {
    const user = await getUserById(c.req.param('id'))
    return c.json(user)
  })
  .post('/', zValidator('json', CreateUserSchema), async (c) => {
    const body = c.req.valid('json')
    return c.json(await createUser(body), 201)
  })

export type UsersRoute = typeof usersRoute

// client.ts
import { hc } from 'hono/client'
import type { UsersRoute } from './server/routes/users'

const client = hc<UsersRoute>('https://api.myapp.com')

// Fully typed!
const user = await client.users[':id'].$get({ param: { id: '1' } })
const newUser = await client.users.$post({ json: { name: 'Atlas', email: 'a@b.com' } })
Enter fullscreen mode Exit fullscreen mode

Cloudflare Workers Deployment 

// src/index.ts
import { Hono } from 'hono'

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

app.get('/kv/:key', async (c) => {
  const value = await c.env.MY_KV.get(c.req.param('key'))
  return c.json({ value })
})

export default app  // Cloudflare Workers entry
Enter fullscreen mode Exit fullscreen mode 
npx wrangler deploy
Enter fullscreen mode Exit fullscreen mode

Deploys globally across Cloudflare's 300+ edge locations. ~1ms latency worldwide.

The Ship Fast Skill Pack includes an /api skill that scaffolds Hono routes with Zod validation, auth middleware, and tests. $49 one-time.

Top comments (0)