-
Notifications
You must be signed in to change notification settings - Fork 0
Architecture
App Type: Mobile app
Description:
This will be a React Native app developed with Expo. It uses Firebase for authentication for user accounts, notifications, one-time phone passcodes, and messaging. We will store any other data related to the user/user account in MongoDB. We will use GitHub Actions for the deployment pipeline. We plan on eventually integrating Steam API's as well to draw user data about their played games instead of having users manually input data, saving time. React Native also has a vast array of libraries to draw from. We will use its Firebase libraries for authentication, its Maps libraries for location-based features and services, navigation and stack libraries for page navigation, Elements/Papers libraries for UI design, etc.
Languages
Our app will be written primarily in TypeScript for type safety, as well as JavaScript for other app functionalities. Both are interchangeable with each other and fully supported by React Native + Expo.
Frameworks
React Native is an open-source framework used for developing cross-platform mobile apps using React. Expo simplifies the development process with built-in tools for debugging, live testing, asset management, and deployment.
IDE
We are using VS Code for our IDE as it is ideal for JavaScript-based projects. It has a lightweight interface, a large array of React Native extensions, GitHub integration, and a built-in terminal with debugging tools.
Libraries
| Library | Description |
|---|---|
| expo | Provides React Native development tools, build configurations, and simplified deployments |
| react-navigation | Handles stack and tab navigation between app screens |
| react-native-maps | integrates map functionality for displaying locations and user positions |
| react-native-paper | Provides cross-platform UI components that follow Material Design guidelines |
| react-native=elements | Provides cross-platform UI components that follow Material Design guidelines |
| firebase | Handles authentication, cloud messaging (notifications), and real-time updates |
| react-native-firebase | Firebases React Native SDK wrapper that helps integrate services like Firestore, Authentication, and Cloud messaging |
| axios/fetch API | Used for making HTTP requests to API's (Steam, Firebase, MongoDB backend) |
| mongoose/express | For handling database operations and connecting the mobile app to MongoDB via backend endpoints |
Services and API's
Firebase We will use Firebase Authentication for managing user accounts/logins, Cloud Messaging for notifications, and Firestore for lightweight storage and real-time updates.
MongoDB User-related and persistent data will be stored and hosted through MongoDB and its free "MongoDB Atlas" for simplicity and scalability.
Steam Web API We plan to integrate the Steam Web API to fetch user game statistics and activity data automatically.
Optional Custom REST API, like Node.js or Express, to bridge the gap between MongoDB and our app.
Package/Build Managers
| Tool | Purpose |
|---|---|
| npm/yarn | Used for managing React Native dependencies |
| Expo CLI | Handles building, testing, publishing for our app (both Android and IOS) |
Release: We will use Expo to create and distribute app binaries, specifically generating an .apk file and uploading it to GitHub Releases for testing.
Each release will be built using the Expo CI/CD process and distributed for easy installation.
Virtual Machines/Containers We are not using anything for our app development. Our workflow does not require Docker or any other Virtual Machines since Expo's local development environment is cross-platform and uses device simulators like:
- Android Emulator (Pixel 7) via Android Studio
- iOS Simulator (iPhone 13) via Xcode for Mac users
We will also test the app on physical devices and web browsers using the Expo Go app and web functionality, allowing for real time testing and debugging through a QR code.
Github Actions
We will use GitHub Actions for continuous integration and deployment automation. Our pipeline is as follows:
1. Run linting and tests on every push
2. Build the Expo project
3. Optionally trigger a release upload to Expo or GitHub Releases
Database: MongoDB Atlas MongoDB Atlas is our cloud-hosted database solution that stores collections for users, matches, messages, and preferences. Its flexibility allows us to store dynamic user data such as interests, favorite games, and experience levels without strict schema constraints. The database will interact with the backend via Mongoose models for easy querying and validation.
Example Collections:
- Users: profile info, trust rating, game preferences
- Matches: user IDs, compatibility score, match status
- Messages: sender, receiver, timestamp, and message body
Authentication: Firebase Authentication Firebase Authentication will handle secure user signups and logins via email and password, or through social logins (optional). It ensures user identity is verified before allowing access to sensitive features like messaging or profile editing.
Hosting: Firebase Hosting Firebase Hosting will serve both our static assets and backend endpoints, simplifying deployment and ensuring fast global performance through built-in CDN support.
Library: Socket.IO Socket.IO will be used to implement live chat between matched users. It enables bi-directional communication between the app and the server, allowing instant message updates without reloading data or polling for new messages.
Protocol: WebSockets WebSockets maintain a persistent connection for low-latency updates. When one user sends a message, the recipient’s chat instantly updates, improving user experience during live gaming sessions or coordination.
| Attribute | Type | Description |
|---|---|---|