Footrace Flutter
Chess.com for running, from main() to the finish line. Written for someone who knows TypeScript, Go, Elixir, Kotlin and Swift, and has never opened a .dart file.
The app lives in footrace-flutter. You pick a distance, the backend matches you with another
runner, and the two of you race live with your phones in your pockets. GPS keeps counting
while the screen is locked, fixes go to the Phoenix backend, and race snapshots come back
over a channel.
Four ways in
Section titled “Four ways in”PrimersDart, Flutter's widget model and Riverpod, each mapped to the languages and UI kits you already know.
StructureThe app layer by layer: shell, features, data, realtime, tracking, design system, tests, build.
FlowsEnd-to-end traces across widgets, providers, isolates and the backend: auth, matchmaking, the race, and what breaks.
DailiesThirteen guided sessions of 30 to 45 minutes each, with the editor open beside the page.
The dailies
Section titled “The dailies”| Day | Topic | Group |
|---|---|---|
| 1 | Dart through lib/core |
Foundations |
| 2 | Widgets and the tree | Foundations |
| 3 | The design system and Widgetbook | Foundations |
| 4 | Routing and the auth gate | App shell |
| 5 | Riverpod through auth | App shell |
| 6 | HTTP, models, repositories | Data |
| 7 | Phoenix channels from the client | Realtime |
| 8 | Queue and lobby | Realtime |
| 9 | GPS and the foreground isolate | Tracking |
| 10 | The upload pipeline | Tracking |
| 11 | The race | Race |
| 12 | The test harness | Quality |
| 13 | Integration, dev tools, release | Quality |
Each day builds on the one before. The primers and structure pages are reference material. Read them when a daily points you there, not front to back.
Source links
Section titled “Source links”Inline references like app/lib/main.dart:9 get gh and open links. Set your local
checkout path and editor once on Editor links. Code was read at
footrace-flutter main @ d1b602a, so line numbers drift as the app changes.