Guided practice — SvelteKit

Runnable in repo

This implementation is available in the repository. Fork it, run locally, and adapt the host UI around the same Experience speak / listen APIs.

Run locally

From the repo root, ./start runs all examples (or ./start sveltekit / ./start nextjs / ./start react-vite for those frameworks). To run only this one:

terminal

cd examples/guided-practice/sveltekit
npm install
npm run dev
# http://localhost:4004

Local URL: http://localhost:4004

Liforma integration

Mount <Experience /> from @liforma/client/svelte:

embed

<script>
  import { Experience } from '@liforma/client/svelte';
</script>

<Experience experienceId={lesson.experienceId} />

Key files

src/routes/+page.svelte — host UI and Experience APIs
src/lib/ — turns / feedback helpers when present

Live demo View source on GitHub Framework overview

Related docs

Embed an Experience
Web Component reference
Live demo — hosted Guided practice app (SvelteKit)
Experience on Meet — hosted experience without the lesson app UI

AI agent prompt

Use the Liforma Guided practice example as source material to build a SvelteKit app.

Source repo folder: examples/guided-practice/sveltekit

Preserve:
- `Experience` from `@liforma/client/svelte` (or JS `Experience.startSession` + `attach`)
- presenter / speak API usage shown in the example
- TypeScript and normal CSS (no Tailwind)

Adapt:
- branding
- scripted lines / host UI
- experience id
- surrounding product UI