Gmail-AdvancedSystemProgramming

This is a full-stack Gmail-like system built as part of an advanced programming university course.
It includes a Node.js + Express backend, React frontend, Android mobile client, and a custom C++ Bloom filter for spam detection.
The project was built following TDD and Agile methodologies, adhering to SOLID principles.

---

Table of Contents

• Tech Stack
  • Project Architecture
  • DB schemas
• Running server and client
  • Getting started
  • Testing bloom filter server and python client
  • Running as web application project
  • env variables
  • Running the android app
• Screenshots
• Useful links
  • CPP server README
  • Python client README
  • JavaScript server README
• Teammates

---

Tech Stack

• Backend: Node.js with Express for handling IO between users and backend.
  C++ for handling the Bloom Filter in spam detection.
• Frontend: React.js for web, Android using Java + XML for mobile.
• Database: MongoDB
• DevOps: Dockerized using docker compose and implemented CI using GitHub Actions to run tests before approving PRs

Project Architecture

Click to view project's architecture

flowchart LR
  %% === Groups ===
  subgraph Clients
    user([User])
    react[React Web App]
    android[Android App]
  end

  subgraph Backend
    node[Node.js + Express]
    cpp[C++ Bloom Filter]
    mongo[(MongoDB)]
  end

  subgraph Infrastructure
    docker[Docker / Docker Compose]
    actions[GitHub Actions]
  end

  %% === Edges ===
  user --> react
  user --> android
  react <--> node
  android <--> node
  node <--> |TCP| cpp
  node <--> |Mongoose| mongo
  node -.build/run.-> docker
  docker -.CI pipeline.-> actions

Loading

DB schemas

Click to view DB schemas

erDiagram
  USER {
    number id
    string fullName
    string mail
    string password
    string dateOfBirth
    string image
    date createdAt
    date updatedAt
  }

  LABEL {
    number id
    string name
    number owner
    number parent
    date createdAt
    date updatedAt
  }

  FILE {
    string name
    string data
    number size
    string type
  }

  MAIL {
    number id
    number owner
    number from
    string subject
    string body
    boolean isRead
    boolean isStarred
    boolean isTrashed
    boolean isSpam
    boolean isDraft
    date createdAt
    date updatedAt
  }

  USER  ||--o{ LABEL : owns
  LABEL o|--o{ LABEL : parent_of
  USER  ||--o{ MAIL  : owns
  USER  ||--o{ MAIL  : sends
  MAIL  ||--o{ FILE  : has
  MAIL  ||--o{ USER : has
  MAIL  ||--o{ LABEL : has

Loading

---

Testing and Running

Getting started

First clone the project

git clone https://github.com/YuvalAnteby/Gmail-AdvancedSystemProgramming.git
cd Gmail-AdvancedSystemProgramming/python_client

If you want to change the configuration (ports, names, bloom filter integers etc.) you can do it in dockerfiles and docker compose.

To test the python client and bloom filter server

This will build and run only the test related containers (CPP server, gtest, python test)

  docker compose --profile tests up --build

Running the entire web app

This will build and run only the web application related containers (React, Node.js, CPP server)

  docker compose --profile web_app up -d --build web_server mongo

env variables

In Node.js and React root folders you can find .env files with default values to help you check the project.
In a real world application these wouldn't be uploaded, we did it for easier set up for the checkers :)

Running the python client

NOTE: The instructions didn't ask to run the python client and express server together using the same command

  docker compose run client --build

• Reminder, to exit the container gracefully use

control+c

Running the android app

0. ensure the backend is running using docker using the previous instructions
1. Download and install the official android studio software
2. Set up an emulator device using an API version of 26 or greater (most modern phones will suffice)
3. You can install the project's app using 2 versions:

• Easy way:

  1. get from the root folder the given APK file
  2. ensure the emulator's device is up and running
  3. drag the file to the emulator's window, it will be installed in it

• The Custom way:

  1. Open android studio when targeting the folder android_app instead of the root folder
  2. Wait for android studio to finish the intial gradle build of the project
  3. click on the green run button using the built in tools and set up to your desire

• in case you need to change the backend's API URL you can do so in gradle.properties located in the sub root folder android_app

---

Screenshots

Click to expand Ex5 screenshots

For more screenshots click here

---

Useful links

• CPP server README
• JavaScript server README
• React frontend README

---

Teammates

• Yuval Anteby
• Roee Chaim
• Dor Darmon

---