← Back to home

Gamotion: A Comprehensive Overview

Gamotion is a full-stack gaming community platform designed to connect gamers through social features, real-time chat, and location-based discovery. The system is built with a unified node.js backend that serves both a react native mobile application and a react web application.

Here is the end-to-end breakdown of the project architecture and features:

1. Backend Architecture (/backend)

The backend is a robust rest API augmented with real-time websocket capabilities.

  • Tech stack: Node.js, express, mongodb (mongoose).
  • Security & middleware: Incorporates helmet for security headers, express-rate-limit to prevent abuse, and cors configured for local development ports.
  • Authentication: Uses jwt (json web tokens) with bcryptjs for secure password hashing.
  • Media storage: Integrated with cloudinary (via multer-storage-cloudinary) for handling user uploads like avatars and post media.
  • Real-time services (socket.io):
    • Chatsocket: handles real-time messaging between users.
    • Postsocket: manages live updates for social feed posts (likes, comments).
    • Notificationservice: emits real-time in-app notifications.
  • Core API routes: Authentication (/API/auth), social graph (/API/follow, /API/friends), content (/API/posts, /API/comments), user discovery (/API/location, /API/users), and analytics (/API/analytics).

2. Mobile App (/ Root Folder)

A production-ready iOS and Android app built for gamers.

  • Tech stack: React native (cli, v0.81), typescript.
  • Navigation: Uses @react-navigation/native with custom conditional rendering logic for authentication flows (e.g., splash screen → auth → main app).
  • State management: Relies heavily on react context API (usercontext, followcontext, chatcontext, notificationcontext).
  • Key dependencies:
    • React-native-firebase/app & messaging: for push notifications.
    • @react-native-community/geolocation: for location-based player matching.
    • React-native-image-picker & react-native-compressor: for optimizing and uploading images/media.
    • Socket.io-client: powers the live chat and feed interactions.
  • Screens: Includes a rich set of views like profilesetup, followers, chat, notificationcenter, createpost, and locationscreen.

3. Web Application (/web)

A modern, responsive web port of the gamotion experience.

  • Tech stack: React 19, typescript, vite (build tool).
  • Routing: Uses react-router-dom for url-based navigation.
  • Styling: Uses pure css (app.css, index.css) with icons provided by lucide-react.
  • Integration: Seamlessly hooks into the same backend API using axios and establishes websocket connections via socket.io-client just like the mobile app.

4. Core End-to-end Features

  • User identity & profiles: Secure sign up/login, profile customization (avatars, bios), and a preference system.
  • Social graph: A robust friend and follower system (sending requests, tracking followers).
  • Content feed: Users can create posts (with text/media), comment, and interact with the broader community in real-time.
  • Live direct messaging: One-on-one real-time chat between friends.
  • Location-based discovery: A feature allowing users to find and connect with other gamers geographically near them.
  • Engagement: Both in-app toasts (via socket notificationservice) and os-level push notifications (via firebase).
← Back to home