GeniusStudy

🚀 What inspired us

We wanted to create a simple and effective study tool that felt fast, intuitive, and personalized. Many flashcard apps felt either too cluttered or too limited, so we set out to build our own—StudyGenius, a lightweight web app that lets users easily create, study, and manage flashcards.

🧠 What we learned

For most of us, this was our first hackathon, and there was a huge learning curve. We explored and implemented technologies that were completely new to us, including:

🔐 Firebase Authentication (email + Google login)
🔥 Firestore database with user-specific data
⚛️ React state management and useEffect logic
💡 Component design and reusability
✨ UI/UX feedback tools like modals, flip animations, and alerts

We also learned a lot about how to work and debug quickly as a team under time pressure.

🛠️ How we built it

Frontend: React (with React Router)
Database: Firebase Firestore
Authentication: Firebase Auth
Styling: Custom CSS (flip animations, modal prompts, responsive design)

Key features:

Create, edit, delete, and flip flashcards
Save flashcard sets with custom names (duplicate protection)
Live editing in the “Edit Flashcards” view
Flashcard flip animation for a better study experience

❗ Challenges we faced

None of us had worked with Firebase or React Router before, so figuring out how to properly route pages and store user-specific data took time.
Building flip animations while keeping layout clean was harder than expected.
Syncing local state with Firestore for live editing was a major technical hurdle.
Working fast and collaboratively during a short event was also a big learning experience.