brat image

Brat Quiz

Not every project needs to change the world! Built as a fun way to explore React and TypeScript, this personality quiz is inspired by Charli XCX's 'BRAT' aesthetic. What started as a learning exercise turned into an entertaining way to practice TypeScript, state management, and testing in React. It's a reminder that learning new technologies can (and should!) be fun.

Key Features

  • Interactive quiz flow with binary choice mechanism
  • Custom animations and transitions for question changes
  • Result calculation and sharing functionality
  • Responsive design for mobile and desktop
  • TypeScript implementation for type safety
  • Local storage for saving progress

Technical Architecture

Frontend

Built with React and TypeScript, focusing on clean component architecture. Implemented custom hooks for quiz state management. Created reusable animation components for consistent transitions.

Backend

Static deployment with quiz data stored in TypeScript interfaces. Implemented local storage integration for progress saving.

Infrastructure

Deployed on GitHub Pages with automatic deployments. Set up development environment with proper TypeScript configurations.