React Native
Learn how to get started with Truv for your React Native application
Launch the demo
Once you have your API keys, it's time to run the Truv React Native Demo app locally.
Make sure you have node
and yarn
installed.
git clone [email protected]:truvhq/demo-react-native.git
cd demo-react-native
yarn
yarn start
Step-by-step overview
This flow involves a user, the application front end, the application back end and the Truv. You can see a visual diagram of tokens and data exchange in Bridge section of docs.
1. Authorize and initialize Bridge
The app sends an API request to Truv for bridge_token.
fetch(`https://prod.citedelid.com/v1/bridge-tokens/`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-Access-Client-Id': '123456',
'X-Access-Secret': 'a1b2c3d4f5g6',
},
body: JSON.stringify({
product_type: 'income',
provider_id: 'adp',
}),
})
The app uses our SDK to load a mobile page from Truv's CDN with bridge_token into WebView. You need to provide a valid bridge_token to the component.
<TruvBridge
bridgeToken="3ksd54jgn8tk7k4tyjds2sfnjsrt"
onClose={() => {
console.log('bridge closed');
}}
onError={() => {
console.log('bridge error');
}}
onEvent={(event) => console.log('event from bridge: ', event)}
onLoad={() => {
console.log('bridge loaded');
}}
onSuccess={() => {
console.log('bridge succeeded');
}}
/>
SDK provides callbacks for events happened on the page. You can use onLoad
, onClose
, onSuccess
, onError
and onEvent
callbacks
Updated about 2 years ago