Frontend developer onboarding

Status: stub. This tutorial is a long-form expansion of the existing Frontend Quickstart reference, with a runnable starter app and complete worked examples. Queued for a subsequent tutorial round.

This tutorial walks you through building a frontend that authenticates through Auth0, exchanges the resulting id_token for a NoETL gateway session, and calls playbooks via GraphQL with live execution updates over SSE. By the end you have a small but complete React + TypeScript app that demonstrates every gateway integration concern a real frontend needs to handle.

Estimated time: 45 minutes.

Prerequisites

• Completed Quickstart so you have a running gateway at http://localhost:<port> (local) or https://gateway.your-domain/ (after GKE production deploy).
• Node 18+ and npm/pnpm/yarn.
• An Auth0 tenant with a Single Page Application client configured. Callback URLs need to include your dev URL (http://localhost:5173 for Vite default).

Step 1 — Setup

Step 2 — Auth0 integration

Step 3 — Exchange Auth0 token for gateway session

Step 4 — Make a GraphQL executePlaybook call

Step 5 — Poll for completion via getExecution

Step 6 — SSE for live execution updates

Step 7 — Error handling

Step 8 — Production hardening

Next steps

• Self-troubleshooting playbook — call a playbook that diagnoses its own failures from your frontend.
• Add a new MCP backend — extend the platform if your frontend needs a backend the platform doesn't have yet.

Troubleshooting