Arskah / expo-firebase-chat

Real-time multimedia chat

Aalto University Mobile Cloud Computing course project

Description

React Native using Expo and Typescript

A React Native Chat app using the Expo framework, Firebase and written in TypeScript. Expo has supported Typescript natively since version 31.

Prerequisites

Install expo-cli globally.

npm install --global expo-cli

If you prefer to use yarn the command is yarn global add expo-cli.

Git clone.

git clone [e-mail]:CS-E4100/mcc-2018-g13.git # or
git clone https://version.aalto.fi/gitlab/CS-E4100/mcc-2018-g13.git

Cd to ChatApp directory and Install dependencies.

cd ChatApp && npm install

Download google-services.json file from Firebase and place it in ChatApp.

Check that app.json file has it included.

"googleServicesFile": "./google-services.json",

In order for Expo to send notifications from our servers using your credentials, you'll need to upload your secret server key. You can find this key in the Firebase Console for your project:

At the top of the sidebar, click the gear icon to the right of Project Overview to go to your project settings. Click on the Cloud Messaging tab in the Settings pane.

Copy the token listed next to Server key.

Run expo push:android:upload --api-key , replacing with the string you just copied. We'll store your token securely on our servers, where it will only be accessed when you send a push notification.

Running the App

Building the Android .apk-file

Run

npm run build

and download the file from link generated by Expo.

Developing

Start the local server. This will give you a QR code that you can scan using the Expo Client app on your mobile device. The app supports hot reload.

npm start

If you"re on a Mac and have Xcode installed, you can run the app using the iOS Simulator with the following command. I am sure you can do something similar with Android.

npm ios

Other scripts

  npm run lint              # Run linter
  npm run compile           # Compile Typescript to JS, serve from dist directory
  npm run clean             # Remove dist folder (compiled code)
  npm run plop              # Create new component from a template