Skip to main content

Type-Safe RPC with jstack

Featul uses jstack, a type-safe RPC framework built on top of Hono, to provide full end-to-end type safety between the server and client. Unlike traditional REST APIs, jstack gives you:
  • Full TypeScript type safety - autocomplete and type checking for all API calls
  • Automatic validation - runtime validation with Zod schemas
  • Simple client usage - no need to manually define types or handle serialization
  • Built on Hono - fast, lightweight, and edge-ready

Client Usage Pattern

All API calls follow the same pattern:
import { client } from "@/lib/client"

// GET request
const res = await client.workspace.bySlug.$get({ slug: "my-workspace" })
const data = await res.json()

// POST request  
const res = await client.post.create.$post({
  title: "New feature request",
  content: "Please add dark mode",
  workspaceSlug: "my-workspace",
  boardSlug: "features"
})
const data = await res.json()

HTTP Methods

The client uses special suffixes to indicate the HTTP method:
  • .$get() - GET request
  • .$post() - POST request
  • .$put() - PUT request
  • .$delete() - DELETE request

Response Handling

All responses are standard Fetch API Response objects:
const res = await client.workspace.bySlug.$get({ slug: "acme" })

// Parse JSON response
const data = await res.json()

// Check status
if (!res.ok) {
  throw new Error(`API error: ${res.status}`)
}

// Access headers
const cacheControl = res.headers.get('Cache-Control')

SuperJSON Support

Featul uses SuperJSON for serialization, allowing you to pass and receive:
  • Dates (automatically serialized/deserialized)
  • BigInt values
  • Regular expressions
  • Maps and Sets
const res = await client.workspace.bySlug.$get({ slug: "acme" })
const { workspace } = await res.json()

// workspace.createdAt is already a Date object, not a string!
console.log(workspace.createdAt.toLocaleDateString())

API Structure

The API is organized by resource:
  • client.workspace.* - Workspace management
  • client.board.* - Board and tag operations
  • client.post.* - Post (feedback) creation and updates
  • client.comment.* - Comments and mentions
  • client.changelog.* - Changelog entries
  • client.member.* - Member activity and statistics

Next Steps

Authentication

Learn about session-based authentication

Workspaces

Manage workspaces and settings

Posts

Create and manage feedback posts

Comments

Handle comments and mentions

Build docs developers (and LLMs) love