Workaiub-student-support-vite-firebase

AIUB Student Support

I built an unofficial student toolkit for AIUB students: an installable web app with a notice alert system, exam schedule and seat plan, faculty directory, CGPA calculator, course schedule generator, AI-drafted request…

Role
Full Stack Developer
Timeline
Feb 2025 – Apr 2025
Main stack
React & Firebase
AIUB Student Support — React & Firebase project screenshot

Overview

I built an unofficial student toolkit for AIUB students: an installable web app with a notice alert system, exam schedule and seat plan, faculty directory, CGPA calculator, course schedule generator, AI-drafted request emails and an online compiler. It runs on Vite, React and Firebase.

Problem

University students juggle notices, exam times, GPA maths and formal request emails across scattered pages and group chats. Notices get missed, schedules clash, and many students are unsure how to word a formal request.

Approach

I put the everyday tasks in one installable web app. It watches the university notice feed and pushes an alert when something new appears, calculates GPA and builds conflict-free schedules in the browser, and drafts formal emails from a short form. Firebase handles accounts and data, so there is no server to run.

Outcome

Pages
38
Student tools
8
Commits
231
Lines of code
~81k
Installable app
1

What I built

  • Notice alerts: new university notices detected and pushed to the browser
  • Exam schedule and seat plan lookup, with a full-schedule view
  • Faculty directory with profiles pulled from the university data feed
  • CGPA calculator for semester and overall results, plus grade upgrade helpers
  • Course schedule generator that avoids time clashes
  • Email generator for course drops, grade upgrades, B-Set exams, leave and account requests
  • E-book library and an academic calendar
  • Online compiler for C++ and HTML practice
  • Accounts with email verification, profiles and department selection
  • Admin dashboard with maintenance mode, user tools and visitor statistics
  • Installable PWA with offline support and an update check

Architecture

System architecture

Diagram: a React PWA using Firebase, the university site and an AI model.
One front-end app. Firebase is the only back end, and the university site is read as a data source. Open full size ↗

Notice alerts

Diagram: check the feed, compare, store and push.
A timed check compares the feed with what is stored and alerts only for new notices. Open full size ↗

Email generator

Diagram: choose a request, fill a form, generate and send.
A short form becomes a formal email in the right format. Open full size ↗

Access rules

Diagram: visitor, student and admin access levels.
Database rules limit each person to their own data. Open full size ↗

Engineering decisions

  1. 01Firebase instead of a custom server

    Sign-in, the database and push messages come from one managed service. A student project can run for free and nobody has to patch a server.

  2. 02Rules live in the database

    Read and write rules check who is asking. Users can read their own record, and only admins can manage others, even if someone bypasses the screen.

  3. 03One check at a time

    The notice check keeps a flag so two checks never overlap. Slow networks cannot cause duplicate alerts.

  4. 04A PWA, not an app store app

    Students install it from the browser. A service worker keeps it fast and a version check tells them when a new release is ready.

  5. 05Unofficial and labelled as such

    The app says it is not run by the university. It only reads public pages and never asks for a student portal password.

Need something similar?

Tell me what you are building and I will reply within one working day.

Start a project
↑↓ navigate↵ openesc closeCtrl K toggles this menu