Use API in frontend

How to use the endpoint in your application depends on whether you want to call the endpoint on the server or on the client.

Svelte components

To call the endpoint from a Svelte component you need to create an api caller and call the endpoint like so:

import { page } from "$app/stores";
import { apiClient } from "@shared/lib/ApiClient";
 
await apiClient($page).newsletter.signup.mutate({ email });

Loading data via server

To call the endpoint in +page.server.ts or +layout.server.ts, create an apiCaller and use the endpoint like:

import { createApiCaller } from "api/trpc/caller";
 
const apiCaller = await createApiCaller();
 
const plans = await apiCaller.billing.plans();
return {
  plans
};