Contra - A professional network for the jobs and skills of the futureStreamline Directus API Integration: SDK Calls in One File
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Wade's avatar
Wade Thomas
• Mar 30
One File to Rule Your Directus Integration
When connecting TanStack Start to Directus, I keep all SDK calls in a single directus.ts file. Here's what that looks like in practice.
Setting up the client
The client is initialized once with session-based authentication and REST support. Credentials are included so cookies are handled automatically across requests.
const directus = createDirectus(directusUrl)
  .with(authentication('session', { credentials: 'include' }))
  .with(rest({ credentials: 'include' }));
Typed data fetching
Each collection gets its own exported async function with a typed return value. The SDK's readItems does the work, and you cast to your local type.
export async function getProducts(): Promise<Product[]> {
  const items = await directus.request(readItems('products'));
  return items as Product[];
}
Filtering is first-class
The SDK's filter syntax maps directly to Directus's query engine — no raw query strings, no URL building.
export async function getProductsByCategory(
  category: string
): Promise<Product[]> {
  const items = await directus.request(
    readItems('products', {
      filter: { category: { _eq: category } }
    })
  );
  return items as Product[];
}
The same file also handles createItem, updateItem, deleteItem, uploadFiles, and user registration — all imported directly from @directus/sdk. One client, one file, full CRUD coverage with complete type safety.
ReactDirectusTypeScript
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started