FinWise

Inspiration

Financial literacy is essential, yet it’s rarely taught in schools. We wanted to empower young people with the knowledge and confidence to manage money wisely—from their first allowance to their first paycheck.

What it does

FinWise is an interactive web app that teaches essential financial concepts through engaging lessons and quizzes. Users can track progress, revisit materials, and build their knowledge step by step.

How we built it

We used React.js for the frontend and Firebase for authentication. Lessons are organized into beginner, intermediate, and advanced levels. Each lesson includes reading material, followed by a 5-question quiz with confetti animations for correct scores!

Challenges we ran into

• Making the quiz modal fully accessible and scrollable
• Handling dynamic routing for different lessons
• Keeping the UI responsive and polished across devices

Accomplishments that we're proud of

• Built a fully functional learning module with login
• Designed a clean, scroll-free interface for quizzes
• Implemented confetti animations and progress tracking

What we learned

• Creating reusable components like Header/Footer
• How to build modals, overlay logic, and state handling in React
• Improving user experience through small interactive touches

What's next for FinWise

• Add user progress saving and analytics
• Introduce gamification and badges
• Expand the content library and launch a mobile version

Built With

• css-modules
• firebase-authentication
• git
• html5
• javascript
• react.js
• vite