React Native Chat App ![React Native](https://img.shields.io/badge/react_native-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB) ![Firebase](https://img.shields.io/badge/firebase-%23039BE5.svg?style=for-the-badge&logo=firebase) ![Expo](https://img.shields.io/badge/expo-1C1E24?style=for-the-badge&logo=expo&logoColor=#D04A37)

Introduction • Features • Installation Guide • Building Guide • Screenshots • Credits • License • Contributors

![GitHub Repo stars](https://img.shields.io/github/stars/Ctere1/react-native-chat?style=social) ![GitHub forks](https://img.shields.io/github/forks/Ctere1/react-native-chat?style=social) ![GitHub watchers](https://img.shields.io/github/watchers/Ctere1/react-native-chat?style=social)

ℹ️ Introduction

Real Time Chat Application that written in React Native and Expo platform. It uses Firebase (Web version 9) realtime database.

For the live demo video see Demo.mp4

https://github.com/Ctere1/react-native-chat/assets/62745858/bcde4aa0-d2f2-4d8c-8716-bf274c059d2e

[!Note] You can check the screenshots below

⚡Features

Feature	Description
`Signup and Login`	Firebase Email/Password sign-in method. Allow users to sign up using their email address and password
`Send Text Message`	Essential for casual messaging
`Send Picture`	You can send pictures without losing quality
`Group Chat`	You can send your messages to multiple people at the same time
`Delete Chat`	You can delete chats after holding and selecting them
`Delete Account`	You can delete your account
`Real Time Chat`	The last incoming message will be placed at the top of the chat screen
`Users List`	Registered users sorted by alphabetical index (A -> Z)
`Note to Self`	You can also take notes by sending a message to yourself

💾Installation Guide

To clone and run this application, you'll need Git and Node.js (which comes with npm) installed on your computer.

 # Clone this repository
 $ git clone https://github.com/Ctere1/react-native-chat
 # Go into the repository
 $ cd react-native-chat
 # Install dependencies
 $ npm install

For running the app:

# Go into the repository
$ cd react-native-chat
# Run the expo
$ npx expo start

After these steps install the Expo Go mobile app from the Google Play Store or Apple App Store on your testing device. This app allows you to run and test React Native applications built with Expo.

[!Warning]
Do not forget to setup .env file for Firebase connection. Please see the doc or see this comment

🏗️Building Guide

To build this application, follow these steps:

Before you can build the application, you need to configure your environment variables. Ensure you have a .env file with the necessary Firebase configuration. Push the .env file to the EAS environment using the following command:
```
eas secret:push --scope project --env-file .env
```
With the environment variables set and dependencies installed, you can build the APK for Android. Use the following command:
```
eas build -p android --profile preview
```

This command will start the build process using the preview profile (see eas.json). The build process will package your application into an APK file that you can install on an Android device.

[!Note] Environment variables defined in a .env file are only considered by the Expo CLI. Therefore, if you upload a .env file to EAS Build, it can be used to inline EXPO_PUBLIC_ variables into your application code.

[!Note] However, the recommended practice is to use .env files in your local environment, while defining environment variables for EAS Build in eas.json. Environment variables defined in your eas.json build profile will be used when evaluating your app.config.js when running eas build and will be available to all steps of the build process on the EAS Build server.

[!Note] This may result in some duplication of variables between .env files and eas.json build profiles, but makes it easier to see what variables will be applied across all environments.