React-Native-Easy-Chatbot

A chatbot demo app using Huggingface inference API, React Native, Expo, and Redux Sagas. Build for Android, iOS, and Web.

Based on:

• Expo SDK 46 React Native for Android, iOS, Web and Expo Go
• Huggingface Question Answering API open source machine learning model
• Redux-Saga Async middleware for Redux
• Ignite from Infinite Red React Native Boilerplate

Features

• The API is called using Redux-Saga for clear, testable async logic
• Axios with Axios-Retry for data fetching
• API error handling
• React Error Boundary
• ESLint and Prettier to standarize formating
• Husky for conventional commits
• Jest for unit testing
• Semantic Release to bump versions and automatically generate CHANGELOG.md
• Github Actions for CI/CD
• Gifted Chat for Material Design and accesability
• Reusable chat component

Installation

git clone https://github.com/kurtvandusen/React-Native-Easy-Chatbot
cd React-Native-Easy-Chatbot
npm i

Optional - Create .env

In the root directory, create a new file named .env and copy and paste the contents from .env.example. Then replace the example value with your own Huggingface API key.

Create a huggingface.co account to get your free API key

Optional - Customize Constants in app.config.js

In the root directory, locate the app.config.js file. Edit the extra: {} section to customize the values the will be used by Expo-Constants for

• huggingfaceKey
• baseURL
• messagesPlaceholder
• messagesErrorMessage

Optional - Change baseURL to use a different Question Answering NLP model

Explore more Question Answering NLP models on huggingface

Simply change your baseURL to use a different model.

Optional - Change Question Answering Context

Update context.ts with the text string of your choice. The chatbot will draw all answers from this text only. The current example context file contains text about the history of Nintendo Co, Ltd. drawn from Wikipedia

Unit Testing Sagas

Here is an example of testing the saga async logic using Jest