Let app state drive the navigation between screens
In this article, I show how to integrate an XState state machine with React Navigation to implement a complete app flow.
This is the second article of a 3 part series — check out the other parts:
- Part 1: Untangle complex flows in your React Native app with XState
- Part 3: Testing XState machines in your React Native app (coming soon!)
In the first article, we imagined a payment authorisation flow for a mobile banking app:
Decouple business logic and the views with a well-established CS model.
In this article, I am describing how we modelled declaratively a complex flow of a banking app by leveraging XState, a JavaScript library to define finite state machines.
This is the first article of a 3 part series — check out the other parts:
- Part 2: Integrate XState with React Native and React Navigation
- Part 3: Testing XState machines in your React Native app (coming soon!)
In the last few months, I have been working on a banking app implemented with React Native.
The latest feature I implemented is a flow to authorise a payment transaction. It works as follows:
- …
A few months ago we had the chance to build a mobile application for a major energy distribution company involved in e-mobility.
The company builds and distributes an e-mobility management dashboard integrated with all the major e-charging service vendors, allowing them to control the charging units distributed across the territory, monitor their parameters, manage contracts and provide complex data visualisations.
The goal was to provide quick access to a restricted set of functionalities of the portal. In particular, we had to provide a way to quickly research the charging units registry of the system for a particular Charging Unit, configure…
Simone D'Avico
Software Engineer with a passion for programming languages
