UT Course Watchlist

A web application that helps UT students track course availability and get notified when spots open up in their desired courses.

Features

• User authentication with Firebase
• Create and manage multiple watchlists
• Add/remove courses to watchlists
• Real-time course status updates
• Responsive design for all devices
• Notification toggle for users
• Global course search with advanced filtering and pagination
• Custom error messages for duplicate/non-existent courses
• Improved UI/UX: popup for creating watchlists, responsive layout, and better error handling

Tech Stack

• Frontend: React (Vite), AWS Amplify
• Backend: Flask, SQLAlchemy, AWS Elastic Beanstalk
• Authentication: Firebase
• Database: PostgreSQL
• Message Queue: Redis (with RQ for task processing)
• Notification Service: SendGrid
• Web Scraping: Selenium (for course data collection)

Frontend Features

• Login/signup with Firebase (Google/email)
• Create, rename, and delete watchlists
• Add/remove courses to/from watchlists
• Global search for courses (title, code, instructor) using tsvector/GIN index
• Filter search results by department, status, instructor
• Pagination for search results
• Notification toggle
• Responsive, modern UI
• Custom error messages for user actions

Backend Features

• REST API for watchlists, courses, and user settings
• Global search and filtering for courses using PostgreSQL tsvector/GIN index
• Custom error messages for duplicate/non-existent courses
• User notification preferences (enable/disable)
• Email notifications for course status changes
• RQ dashboard for background task monitoring

Deployment

📝 Recommended Tutorial:

For a comprehensive guide on deploying your app to AWS Elastic Beanstalk using Docker Compose and the EB CLI—including how to build and upload images to AWS ECR—check out this excellent Medium article:

Deploy your app to AWS EB using Docker Compose and EB CLI

This tutorial is especially helpful if you want to leverage your docker-compose.yaml for production deployments on AWS.

• Backend: Hosted on AWS Elastic Beanstalk
  • Use ACM for SSL certificates
  • Point custom domain to ALB endpoint (not EB CNAME)
• Frontend: Hosted on AWS Amplify
  • Set environment variables for Vite (VITE_*)
  • Use build command: npm run build

Prerequisites

• Python 3.8+
• Node.js 16+
• npm or yarn
• Firebase account

Environment Variables

Create the following .env files:

Backend (.env in backend directory)

FLASK_APP=app.py
FLASK_ENV=development
DATABASE_URL=postgresql://<user>:<password>@<host>:<port>/<dbname>

Frontend (.env in frontend/ut-watchlist directory)

VITE_FIREBASE_API_KEY=your_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_auth_domain
VITE_FIREBASE_PROJECT_ID=your_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_storage_bucket
VITE_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
VITE_FIREBASE_APP_ID=your_app_id
VITE_FIREBASE_MEASUREMENT_ID=your_measurement_id

Setup Instructions

Backend Setup

1. For macOS users: To enable multithreading, add this line to your ~/.zshrc file:

   export OBJC_DISABLE_INITIALIZE_FORK_SAFETY=YES

2. Create and activate a virtual environment:

   cd backend
   python -m venv myenv
   source myenv/bin/activate  # On Windows: myenv\Scripts\activate

3. Install dependencies:

   pip install -r requirements.txt

4. Initialize the database:

   python scripts/init_db.py

5. Start Redis server (required for background tasks):

   redis-server

6. Start the RQ worker (in a separate terminal):

   cd backend
   rq worker

7. Start the Flask server:

   flask run

Frontend Setup

1. Install dependencies:

   cd frontend/ut-watchlist
   npm install

2. Start the development server:

   npm run dev

Development

• Backend API runs on http://127.0.0.1:5000
• Frontend development server runs on http://localhost:5173
• Redis server runs on localhost:6379
• RQ worker processes background tasks

Architecture

Background Tasks

The application uses Redis and RQ for processing background tasks:

• Course data scraping and updates
• Watchlist monitoring
• Email notification delivery

Data Flow

1. Course data is scraped from UT course catalog
2. Data is stored in PostgreSQL database
3. Redis worker monitors course availability
4. Users receive email notifications when spots open up

License

This project is licensed under the MIT License - see the LICENSE file for details.