Projects
Project
Interactive Demo Showcase
An example project page showing how a live Flutter app embeds right into the story.
· 1 min read
FlutterDartWeb
Loading demo…
Project pages can do something posts on most sites can’t: let the reader use the thing without leaving the page. The demo above is a live, embedded web app running in a phone frame — tap the button and watch it respond.
How the embedding works
- In your Flutter project, run
flutter build web. - Copy the contents of
build/web/into this site atpublic/demos/<name>/. - Reference it in a post:
<FlutterEmbed src="/demos/weather-app" frame="phone" />
That’s it — the component handles the responsive sizing, lazy loading (the iframe only loads when scrolled near, so pages stay fast), a loading state, and an “open in new tab” fallback.
Or host the demo separately
For heavier builds, host the Flutter app on its own (its own Firebase Hosting site works nicely) and point the embed at the full URL — everything else stays the same.