Converting a React app into an iOS app

Converting a React app into an iOS app sounds like a port, and it is usually treated as one: the interface is rebuilt in Swift, two codebases are maintained, and they drift apart within a quarter. Body Heal did not do that. It is a wellness coaching platform built as a mobile-first web app on React and Supabase, and the iOS version is the same code wrapped by Capacitor, with native capability added only where the phone genuinely has to do something a browser cannot.

The decision about where to go native came down to one feature. Clients follow personalised workout programmes, and the programmes are video. A web video element inside a wrapped app behaves like a web video element, which on a phone is not good enough for someone in the middle of an exercise, so the player was built as a custom integration on the Vimeo API rather than left to the defaults. Everything else, the dashboards, the progress logging and the workout library, stayed shared.

The harder problem was that one app had to be three. An admin, a coach and a client each see a different slice of the same records, and a three tier subscription decides what a client can reach inside their own account. That separation lives in the database rather than in the interface, because an interface can be bypassed and a database policy cannot, and it is the part that would have had to be written twice if the iOS app had been a rebuild.

Performance is where a wrapped app usually gives itself away. A list that stutters or a chart that redraws on every change reads immediately as a website pretending to be an app. The interface was tuned to hold 60fps on a phone, and progress arrives through Supabase realtime subscriptions, so a coach watching a client dashboard sees a logged workout as it lands rather than after a refresh.

A native rebuild would have been wrong for a product whose value is the relationship between a coach and a client, where every hour spent keeping two codebases in step is an hour not spent on the thing people pay for. The four screens that came out of it are in the case study.