Skip to content

10. Interim Conclusion

We have seen, example after example, everything needed to write the client [Ionic] from [RdvMedecins]:

Requirements
In Flutter
In Ionic + Angular
a screen
a widget tree, described by `build()`
a component: a TypeScript class and an HTML template, made up of Ionic components
data that changes
the state of a StatefulWidget (setState), or a ChangeNotifier
signals (signal, computed, effect)
forms
TextField and its controllers, InputDecoration.errorText
ion-input, ngModel, reactive forms (FormGroup, Validators)
multiple screens, addresses, guards
go_router (GoRoute, ShellRoute, redirect)
the Angular router, ion-router-outlet, ion-tabs, guards (CanActivateFn)
shared data
provider (ChangeNotifierProvider, context.watch / read)
signal-based services, provided via dependency injection (inject)
await
Future, Stream, async/await, FutureBuilder
Promise, Observable (RxJS), async / await, resource, toSignal
HTTP requests
the HTTP package, a client that handles cookies, an access layer to the API
HttpClient, the development proxy, CapacitorHttp on Android, an access layer to API
two languages
JSON dictionaries, intl, flutter_localizations
JSON dictionaries, the Intl object, the locale attribute of Ionic components
on-device storage
shared_preferences
@capacitor/preferences

The client [Flutter] was using a few packages, one per requirement; the client [Ionic] uses none other than [Angular], [Ionic], and [Capacitor]: [Angular] provides the router, forms, the HTTP client, dependency injection, and signals; [Ionic] provides the components, page stack, windows, tabs, and calendar; [Capacitor] provides storage and native queries. And in [Android], the token cookie—which the [Flutter] client previously had to manage on its own—is now stored and returned by the native code, just as a browser does. All that’s left is to put it all together.