Live Demo: http://student-malachi-valle-uploads.s3-website-us-east-1.amazonaws.com
Started: May 2026

You will need own .env with MongoDB Atlas connection string.

Start Frontend

cd frontend
copy .env.example .env
Update VITE_API_BASE_URL in .env to your backend URL (for example http://<EC2_PUBLIC_IP>)
pnpm dev

Start Backend

cd backend
source venv/Scripts/activate
uvicorn app.main:app --reload

Exit Backend VENV

deactivate

Test Backend

cd backend
python tests/error_handlers/test_visual.py
pytest tests/error_handlers/test_errors.py -v

Tech Stack

Frontend:

• React
• TypeScript
• Tailwind CSS
• TanStack Query
• Axios

Backend:

• FastAPI
• Python
• MongoDB Atlas
• JWT Authentication
• Bcrypt
• Pytest
• SlowAPI
• Nginx

External APIs:

• TMDB API
• IGDB API

Deployment / Infrastructure::

• AWS EC2
• AWS S3
• Terraform
• GitHub Actions

To-Do:

• Internationalization
• ELK Stack (Support Tools for Monitoring)
• Apache Kafka
• Microservices

Current Features

• User authentication
• JWT-based login system
• CRUD functionality
• Search/filter/sorting
• User-specific permissions
• Backend validation
• Frontend validation
• Automated testing
• Data Caching
• External API integration
• Trending/recent media discovery
• User collections/library system
• Centralized error handling
• Search engine optimization

Dev Log

Day 1: May 11th

• Built the initial full-stack project structure.
• Connected FastAPI backend to MongoDB Atlas.
• Created core API routes for GET, POST, PATCH, and DELETE requests.
• Verified frontend could successfully communicate with backend APIs.

Day 2: May 12th

• Expanded API query functionality:
  • result limiting
  • filtering by value ranges
  • search functionality
  • sorting options
  • collection selection
• Refactored both frontend and backend code to make things easier to scale as features get added.
• Cleaned up component structure and separated API logic from UI logic.

Day 3: May 13th

• Added user authentication system.
• Stored user accounts in MongoDB.
• Implemented password hashing with bcrypt.
• Fixed bcrypt version issue during setup.
• Connected frontend UI state to backend auth state.
• Added backend validation for API requests.
• Added frontend validation to prevent invalid submissions before making unnecessary API calls.
• Linked created movie entries to specific users.
• Users can only edit/delete their own entries, while admins can manage all entries.
• Added pytest tests for backend endpoints — all currently passing.

Day 4: May 14th

• Added React Query for data caching to reduce API calls for repeated queries.
• Added SlowAPI rate limiting to prevent login spam and brute force attacks by IP address.
• Added loading indicators while fetching movies.
• Added user-facing error messages for failed requests (including rate limit responses).
• Handled mutation errors and surfaced them in the UI.
• Added visual feedback on buttons during pending mutation states.

Day 5: May 18th

• Refactored the project away from locally stored sample movie data and migrated fully to external APIs.
• Rebuilt the MongoDB structure with dedicated users and user_library collections.
• Integrated TMDB and IGDB APIs to dynamically fetch movie, TV show, and game data.
• Shifted the project into a media collection platform where users can build and share personal libraries.
• Added API routes for trending content and recently released media.
• Refactored older code into smaller reusable components to improve maintainability.
• Removed outdated code and cleaned up project structure after the architecture change.
• Continued improving frontend styling and UI consistency.

Day 6: May 19th

• Created UserMenu component to house certain user operations.
• Connected directly to AWS EC2 instances through the IDE terminal using SSH.
• Set up Terraform and began using Infrastructure as Code concepts to manage cloud resources instead of configuring everything manually.
• Used Terraform to help provision and configure deployment infrastructure for the application.
• Deployed the frontend to an AWS S3 bucket configured for static website hosting.
• Configured Nginx on the EC2 instance to act as a reverse proxy for the FastAPI backend and route incoming traffic correctly.
• Added GitHub Actions workflows using .github/workflows deployment YAML files.
• Configured GitHub repository environment variables and secrets for deployment automation.
• Set up automatic deployment pipelines so pushes to the master branch trigger frontend and backend redeployments automatically.
• Improved production environment configuration using .env variables instead of hardcoded localhost URLs.
• Debugged deployment issues related to CORS, environment variables, API routing, and frontend/backend communication.

Day 7: May 20th

• Added a dedicated account management/settings page for user profile customization.
• Expanded the user data model to support additional profile information and personalization features.
• Added support for:
  • custom profile colors
  • user bios
  • Discord/social links
  • editable usernames
  • password changes
• Added a community page that displays registered users and their public profiles.
• Improved frontend state management and caching behavior for recently added content.
• Implemented useInfiniteQuery for paginated trending content to cache previously loaded pages and improve scrolling performance.
• Refactored account-related UI into smaller reusable components for maintainability.
• Improved profile styling and overall UI consistency across account/community pages.
• Continued refining API integration and frontend/backend synchronization, and data validation for user settings updates.

Day 8: May 21st

• Refactored the Navbar into a more responsive layout for smaller screen sizes and mobile support.
• Added a new NavbarUserBanner component to display the currently logged in user's information directly in the navigation UI.
• Created a dedicated hooks folder and extracted commonly reused logic into reusable custom hooks.
• Improved frontend code organization by separating repeated state/query logic from components.
• Fixed token synchronization issues so authentication data updates correctly after username changes.
• Updated user banner data to immediately reflect collection/item count changes after adding new entries.
• Ran ESLint across the project and resolved all remaining linting errors/warnings.
• Focused primarily on cleanup, maintainability, responsiveness, and quality-of-life improvements rather than major feature additions.

Update: May 25th

• Implemented centralized error handling across frontend and backend with standardized exception classes and global error handlers.
• Created custom exception types for validation, authentication, authorization, rate limiting, and database errors.
• Built out a complete error utility system on the frontend with error parsing, type checking, and user-friendly message generation.
• Created pytest test suite for backend error handling with 16 passing tests covering all error scenarios.
• Fixed authentication and library state synchronization issues between frontend and backend to prevent token expiration bugs.
• Enhanced user feedback with auto-dismissing error banners and proper error state management across all pages.