Chat
Overview
Chat app is an app for mobile devices using React Native. The app provides users with a chat interface and options to share images and their location.
Purpose & Context
To build a chat app that I can add to my portfolio and demonstrate my knowledge of JavaScript mobile development.
Objective
The aim of the project was to build a native chat app built with React Native optimized for both Android and iOS devices.
Duration
7 Days
Credits
- Tutor: Terver Aosu
- Mentor: Stephen Barungi
Built With
- Expo
- React Native
- Google Firebase
- Android Studio
- Gifted Chats
Approach
01 Expo
First I: Applied Expo, to set up my first React Native project and used my own device and an Android Emulator to check that everything was working as intended.
02 Chat UIs & Accessibility
Then I: Implemented the design and layout using gifted chat.
03 Real-Time Applications & Data Storage
Next I: Implemented a database solution for your app using Firestore. Because my app needs real-time data (so that users can see new messages instantly), I created a Firestore database that will store every message that’s sent by my users.
04 Storing Data on the Client Side
Then I: Stored my chat app’s messages offline using React Native’s AsyncStorage and partially enabled some of the app’s features when the device is offline using NetInfo.
05 Communication Features
Next I: Added two new communication features, giving users the ability to send images (chosen from their device’s image library or taken with the camera) and share their current location. Decided to store users’ images in Google Cloud Storage so that other chat participants can view them.
06 Documentation
Finally I: Included all the necessary steps in my github repo for someone to follow and set up my chat app.
Retrospective
What went well?
I found building an app in react native to be a seamless process. I like the flexibility that react native framework allows for building Android and iOS apps that only requires one codebase.
What didn't go well?
I would've liked a way to view the app through a demo or other medium rather than using android studio. I found the app to be a bit slow and heavy to use.
Future Steps
I would like to continue to build on the chat app by adding the ability to record and play sounds, the ability to upload an audio file and the ability to send an audio file.
Final Thoughts
Overall, this was a great introduction to mobile development and I found the use of react native to be an enjoyable experience. By requiring only one codebase for building Android and iOS apps, react native simplifies the development process and prevents me from creating redundant code.
Contact
Please use the form below to send me a message. I'll be happy to hear from you.