Skip to content

Antonhansel/react-native-auth-boilerplate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Native Auth Boilerplate

This is a React Native boilerplate with auth already implemented. It uses Nativebase for UI and Hasura APIs for backend.

gif

You can also use it without Hasura, but you will have to write your own backend implementation.

You can use it with and without the Expo SDK.

Try out on Expo

Scan this QR Code from your Expo application to try out this application.

gif

Who should use this?

  • Fullstack React Native developers looking to start building an app with authentication already covered.
  • Developers at a hackathon trying to build React Native applications from scratch.
  • Developers who want a working authentication backend to further customize it as per their requirements.
  • Developers trying to use Hasura with React Native.
  • Developers who need basic authentication UI and want to write the backend logic themselves.

Getting Started

With Hasura APIs

Make sure to have hasura CLI installed.

  • Clone the repo and cd into it.

    $ git clone https://github.com/hasura/react-native-auth-boilerplate
  • cd into expo directory if you wish to use the expo SDK or cd into vanilla directory

  • Quickstart the base Hasura project and apply the configuration of the project to the newly created Hasura cluster

    $ hasura quickstart base
    $ cd base
    $ git add . && git commit -m "Applying configuration"
    $ git push hasura master

The hasura quickstart command clones a base Hasura project with basic configuration and creates a free tier Hasura cluster. Running a git push to the hasura remote applies the configuration from the project (here base) to the cluster.

  • You will obtain a cluster name after running hasura quickstart. Go back to the expo (or vainalla) directory and set this clusterName in Hasura.js. Also set useHasuraApis to true.

    const clusterName = "clustername44";
    const useHasuraApis = true;
  • Install node modules and run the app.

    $ npm install
  • Run the app.

    • If you are using Expo,

      $ npm start
    • If you are using vanilla React Native,

      # For Android
      $ react-native run-android
      
      # For iOS
      $ react-native run-ios

To get started with React Native development using Hasura, head to hasura/hello-react-native on Hasura hub.

Without Hasura APIs

You have to configure login methods if you are not using Hasura APIs. Check the detailed instructions for about configuration.

Detailed Instructions for Usage

Contribute

We will be very glad to receive contributions from the community. Check issues with the label "help wanted" and submit a pull request.

If you have a bug report or a feature request, please open an issue.

Gallery

Login with Username

iOS

iosusername

Android

androidusername

Login with Email

iOS

iosemail

Android

androidemail

Login with OTP

iOS

iosotp

Android

androidotp

Google and Facebook

iOS

iossocial

Android

androidsocial

About

A react native boilerplate with authentication already implemented

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published