Case study · Sport & Technology

FIBA Coaching App.

A full rebuild of a basketball coaching platform - migrating hundreds of thousands of records, enabling staff collaboration and offline work, and rescuing its tactical diagram editor.

12months

266merged pull requests

75screens

52API content types

~3,800automated tests

−50%diagram engine payload

The starting point

The client had a coaching application that had been live for years: drills and plays, practice plans, rosters, educational content and a tactical diagram editor. It was in real use, but had stopped moving technically.

One account = one coach

Everything belonged to one coach account. Genuine staff collaboration required a new data-ownership model.

A large historical dataset

Roughly 442k drills, 304k diagrams, 30k plays, 18k playbooks and thousands of practice plans per account had to survive the migration.

A schema full of traps

Numeric columns held text, relations were empty, slugs were missing, and documentation and types did not match production data.

No mobility

The application required a live connection, could not be installed, and its frozen jQuery/Snap.svg editor no longer handled modern touch devices.

Content locked in a legacy CMS

Articles were raw HTML and recordings were split between MP4 files and embeds without a consistent publishing model.

Project scope

We rebuilt the coach-facing application: a new frontend, API and collaboration model on top of the same migrated production data. This was not a greenfield restart.

We proposed and delivered a workspace model in place of individual ownership. The selected workspace determines where records are created, which library is available, and who may edit or delete. This was a product decision prepared with the client, not merely an implementation task.

Practice plansBlocks, stations, split sessions, attendance, notes and recurring series.

CalendarMonth and day views, recurring sessions and event series recovered from legacy data.

Knowledge libraryDrills, plays, playbooks, breakdown drills, categories and workspace-scoped tags.

RosterTeams, players, coaches, roles, membership history and invitations.

Diagram editorCourt diagrams with touch support, fullscreen mode and step-by-step work.

Educational contentMigrated articles and coaching clinics with filters, tags and in-video marks.

PDF exportNine print surfaces rendered in headless Chromium plus a ZIP bundle of diagrams.

Offline mode (PWA)Reading and writing without a network, a durable outbox, and iOS/Android installation.

We also delivered the server layer: 52 Strapi content types, workspace-scoped endpoints, permissions, invitations, migrations and repair scripts for legacy data.

A case of its own: the tactical diagram editor

The old editor's scene format was the contract for roughly 304,000 drawings, so replacing it was not an option. We inherited a frozen 1.3 MB bundle with no build process and no vendor support.

What we found

Touch did not work

Obsolete feature detection prevented finger input, while pinch-to-zoom left stray lines on the court.

More than half was dead code

jQuery 1.8.3 and JSZip were loaded without a real consumer.

An invisible archive

XML-only scenes appeared neither in plans, nor thumbnails, nor print.

A desktop-only interface

Dialogs escaped the layout, controls covered the court and some actions required a mouse.

How we approached it

We introduced disciplined vendor patching: a recorded baseline, a register for every patch, no deletion of original code, and readable sources mirroring every change. We kept all historical scenes compatible while turning the foreign engine into a safely maintainable part of the product.

Bundle size1,334 KB673 KB

Compressed301 KB136 KB

Parse and start-up29.1 ms6.9 ms

Diagram thumbnail~240 KB PNG~6 KB WebP

Finger drawing works on modern iOS and Android, and two-finger gestures no longer mark the court.
Historical XML-only scenes are rendered by the same engine and regain images used in plans, thumbnails, PDFs and ZIP exports.
Output remains byte-for-byte identical after slimming, verified across scenes, PNG export and court structure.
Fullscreen mode, gestures, one-tap editing and wheelchair basketball support make the editor usable on phones and tablets.
The editor works offline and diagrams created without a network join the durable write queue.

Technologies used

Frontend: Next.js 16, React 19, TypeScript 5
UI: Tailwind CSS v4, Radix UI / shadcn, Vaul, dnd-kit, React Hook Form + Zod
Backend: Strapi 5, MySQL 8, Knex migrations and HttpOnly cookie authentication
Offline: Custom Service Worker, IndexedDB, a durable outbox and idempotency keys
Infrastructure: AWS EC2, RDS, S3 and CloudFront; LocalStack and Docker Compose locally
Documents: Headless Chromium and Playwright for server-side PDF rendering
Quality: Vitest 4, Testing Library, Playwright, ESLint, Biome, CSP and automated quality gates

All API communication happens server-side. The browser never calls the backend directly, and the session remains in an HttpOnly cookie.

The role of AI in the rewrite

The project ran as AI-assisted work from day one. The decisive part was not code generation itself, but the rigour that made its output safe to accept into production.

Standards as a contract

17 rule files and 7 documented workflows gave every model and tool the same requirements from the start.

Specialised sessions

40 self-contained briefs defined scope, file maps, API payloads and the rules most at risk. Results returned as ordinary pull requests.

Verification instead of trust

Every backend fact was confirmed against the running API. Documentation and types remained hypotheses until real data proved them.

Quality gates

Types, tests and two linters decided whether work was complete. Nearly 3,800 tests enabled speed without regressions.

Multi-track review

The highest-risk offline features went through 11 documented review rounds. Every defect received a fix and a regression test.

Decisions remain human

The workspace model, feedback scope, vendor-patching approach and choices about what not to build were prepared with consequences and approved by the client.

The result: 266 pull requests and 576 commits in 12 months while reconstructing an undocumented production data model and maintaining comprehensive test coverage.

Results achieved

Application shipped

75 screens are live in production, with staging updated automatically.

Historical data preserved

We migrated the library, diagrams, playbooks, recurring sessions and archived content without losing users' work.

Real staff collaboration

Workspaces, invitations, roles and consistent permissions enabled shared work.

Full offline mode

Plans, attendance and content editing work without a network, protected against conflicts and duplicate writes.

Mobile without app stores

The PWA installs on iOS and Android and launches with native behaviour.

The editor rescued

It is half the weight, works with touch and offline, and preserves roughly 304,000 historical drawings.

Quality enforced by code

Around 3,800 tests and 64 end-to-end scenarios also cover network loss and browser restarts.

A repeatable AI-assisted process

Every one of 266 pull requests passed review and the complete set of automated quality gates.