Skip to content

Repository files navigation

A gaming-focused social media platform - share stats, post highlights, connect with players.

Netlify Status  License  Contributors  Stars  Discord


Communify App Screenshot

📖 About

Communify is a full-stack gaming social network built as a Bachelor's final year project. Players can register, create posts sharing gaming moments and stats, comment on others' posts, like/dislike content, search for other users, and manage their own profiles - all within a responsive, real-time web app.

📑 Bachelor's Thesis PDF - Full project documentation and design specification.

✨ Features

  • 🔐 Authentication - Email/password sign-up & sign-in, Google OAuth, email verification, and password reset
  • 📝 Posts - Create, view, like/dislike, and delete gaming posts with image uploads
  • 💬 Comments - Comment on any post in real-time
  • 👤 User Profiles - Browse all users, view individual profiles and their posts
  • 🔍 User Search - Live search across the user directory
  • 🛡️ Route Guards - Auth-protected routes; unauthenticated users are redirected automatically
  • 📱 Mobile Gate - Dedicated landing page for mobile visitors (desktop-only app by design)
  • 🌐 Firebase Backend - Firestore database, Firebase Auth, and Cloud Storage
  • ⚡ NgRx State Management - Centralized reactive state for auth, posts, and users

🛠️ Tech Stack

Layer Technology
Framework Angular 9
Language TypeScript
State Management NgRx (Store, Effects, Devtools)
Backend / DB Firebase (Firestore, Auth, Storage)
UI Components Angular Material
Layout Angular Flex-Layout
Styling SCSS
Hosting Netlify

🚀 Getting Started

Prerequisites

  • Node.js v12.x (required for Angular 9)
  • Angular CLI v9.x - npm install -g @angular/cli@9
  • A Firebase project with Firestore, Authentication, and Storage enabled

Installation

# 1. Clone the repository
git clone https://github.com/utsanjan/Communify.git
cd Communify

# 2. Switch to the source branch
git checkout master

# 3. Install dependencies
npm install

# 4. Add your Firebase config to the environment files
#    Edit:  src/environments/environment.ts
#           src/environments/environment.prod.ts

# 5. Start the dev server
ng serve

The app will be available at http://localhost:4200.

Build for Production

ng build --prod

Output is written to dist/. Deploy the contents to any static host (Netlify, Firebase Hosting, etc.).

🔒 Environment Setup

Create/update src/environments/environment.ts with your Firebase project credentials:

export const environment = {
  production: false,
  firebase: {
    apiKey: "YOUR_API_KEY",
    authDomain: "YOUR_PROJECT.firebaseapp.com",
    projectId: "YOUR_PROJECT_ID",
    storageBucket: "YOUR_PROJECT.appspot.com",
    messagingSenderId: "YOUR_SENDER_ID",
    appId: "YOUR_APP_ID"
  }
};

⚠️ Never commit real API keys. Use environment variable injection or Firebase App Check for production.

👥 Project Contributors



About

A dynamic gaming social media website tailored for seamless sharing of your latest game stats and updates (Bachelor's Final Year Project)

Topics

Resources

Security policy

Stars

11 stars

Watchers

1 watching

Forks

Sponsor this project

Used by

Contributors

Languages