API Integration
Type-safe API calls with Eden Treaty
API Integration
Eden Stack uses Eden Treaty for fully type-safe API communication between your frontend and backend.
How It Works
Eden Treaty automatically generates a type-safe client from your Elysia API definition. Change your API, get instant TypeScript errors in your frontend.
Basic Usage
import { getApiClient } from "@/lib/api";
// In a route loader
export const Route = createFileRoute("/users")({
loader: async () => {
const api = getApiClient();
const { data } = await api.users.get();
return { users: data };
},
});Making API Calls
GET Requests
const api = getApiClient();
// Simple GET
const { data } = await api.users.get();
// With query parameters
const { data } = await api.users.get({ query: { limit: 10 } });
// With path parameters
const { data } = await api.users({ id: "123" }).get();POST Requests
const { data, error } = await api.users.post({
name: "John Doe",
email: "john@example.com",
});
if (error) {
console.error("Failed to create user:", error);
}Error Handling
Eden Treaty returns errors in a type-safe way:
const { data, error, status } = await api.users.post(userData);
if (error) {
switch (status) {
case 400:
// Validation error
break;
case 401:
// Unauthorized
break;
case 500:
// Server error
break;
}
}Server-Side vs Client-Side
The getApiClient() function handles both SSR and client-side rendering automatically using TanStack's createIsomorphicFn().
Full documentation for Eden Stack users
This documentation is exclusively available to Eden Stack customers. Already purchased? Log in to access the full content.