Relevant for AI Apps: How Your Frontend Talks to a FastAPI Backend

~13 min read

Tying the whole unit together with the concrete shape of a real AI app: a browser frontend, a FastAPI backend, and the LLM provider as a THIRD party the backend talks to on the frontend's behalf.

Relevant for AI Apps: How Your Frontend Talks to a FastAPI Backend is a Pro topic

Sign in, then upgrade to Pro or Power to unlock this topic and the full AI Engineering curriculum.

Key points

  • A real AI app usually has three parties: the frontend (browser client), your backend (e.g. FastAPI), and the LLM provider's API — not just two
  • A request makes two hops: frontend -> your backend, then your backend -> the LLM provider — your backend is a server to one side and a client to the other
  • Keeping the LLM provider's API key on the backend (never in frontend JavaScript) prevents any user from stealing it via their browser's developer tools
  • Your backend can enforce rate limiting, logging, and business logic in that middle hop — checks a client-side-only app could never reliably enforce
  • This two-hop, dual-role pattern is the standard shape behind essentially every production AI chat application