React-Native

Sawo React-Native SDK

Current version Supported React Native Version

Demo

Table of Contents

  • Overview

  • Peer Dependencies

  • Installation

  • License

Overview

Sawo provides the api and infrastructure you need to authenticate your users in react-native project.

For more information, visit the Sawo SDK documentation.

PeerDependencies

Sawo have peer dependecies on

  • react

  • react-native

  • react-navigation

  • react-native-webview

Installation

Peer Dependecy check

  • Check if react-naviation is properly installed, if not please follow React navigation installation doc

  • Check for 'react-native-webiew', it is required package for Sawo. As currently auto linking for package depencdy is not there in react-native.

    npm i react-native-webview

Generate API_KEY and SECRET_KEY

  • Login to sawo dev console.

  • Create a new project

    • Set Project Name

    • Set Project Host

      • For dev: point to localhost

      • For prod: point to your domain.

  • Copy your API key & Secret Key (Secret key will mailed you on your registered email address)

To get started with Sawo, use the npm to add the package to your project's dependencies:

$ npm install react-native-sawo

Configuration

import Sawo package in your project

import Sawo from 'react-native-sawo';

Configure your route

import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen
name="YOUR_LOGIN_ROUTE"
component={Sawo}
options={{
title: 'OTP Login',
headerShown: false, // by default its true, to hide the header
}}
/>
</Stack.Navigator>
</NavigationContainer>

then when calling route, we need to pass required credentials and a callback method to receive the user login data

navigation.navigate('YOUR_LOGIN_ROUTE', {
apiKey: 'YOUR_API_KEY',
secretKey: 'YOUR_SECRET_KEY',
identifierType: '', // email | phone_number_sms,
callback: data => {}
});