React Native Group Chat

This is a single group chat application where one can chat with all the members having the application. It is implemented using firebase realtime database.

Screenshots:

Setup:

1. Create a GCP project
2. Create OAuth client id for google signin
3. Add Firebase to this project
4. Create a web app in firebase
5. Create a realtime database and edit the rules
6. Clone this repo
7. Make changes to credentials.js
8. Run the application

1. Create a GCP project:

Go to GCP console and create a new project.

2. Create OAuth client id for google signin:

Now go to API & Services and then add an OAuth consent screen, select user type as External and add some app name and email. Hit save and continue and then go to credentials tab.

Create a OAuth client ID credential and fill the details.

SHA-1 ceritficate fingerprint is random and is generated using

$ openssl rand -base64 32 | openssl sha1 -c

3. Add Firebase to this project:

Go to Firebase console and add firebase to the same gcp project.

4. Create a web app in firebase:

Go to project settings, in general tab, create a web app.

Give it some name and copy the firebaseConfig object.

Make sure your webapp is created.

5. Create a realtime database and edit the rules:

Go to realtime database tab and create it.

Edit the rules as follows:

6. Clone this repo:

Clone repo and install npm packages.

$ git clone https://github.com/Sanket-Valani/react-native-group-chat.git
$ cd react-native-group-chat
$ npm install

7. Make changes to credentials.js:

Edit this credentials.js file The CLIENT_ID is the OAuth API key which will be create after Step 2 and the firebase_js is the firebaseConfig object in Step 4.

8. Run the application:

Connect your phone and laptop/pc to a common wifi network and then run

$ npm start

App will get listed in the Expo client.

Note:

This app will run properly on an Expo client only. To run it on a standalone app please refer this.