Inspiration

My father has always been my inspiration. I grew up watching him run a small school where many students came from low-income families and struggled to pay their fees. Seeing both his efforts and the students' hardships made me realize how financial barriers can limit access to education. This deeply personal experience motivated me to take action.

FundMyStudy was born from the belief that education should be accessible to all, regardless of financial background. While many students face rising costs, there are also generous individuals eager to help but without a clear, trustworthy way to do so. Our platform bridges this gap—connecting students in need with verified donors, and ensuring every contribution makes a direct, meaningful impact.

What It Does

FundMyStudy is a comprehensive platform designed to connect students seeking financial aid with generous donors.

For Students

  • Profile Creation: Students can create detailed profiles outlining their academic journey, financial needs, and personal stories.
  • Campaign Management: Set funding goals, describe the purpose (e.g., tuition, living expenses, books), and upload videos to personalize appeals.
  • Document Upload: Secure upload of verification documents like transcripts, enrollment letters, and financial proof.
  • Privacy Controls: Full control over profile visibility and communication preferences.

For Donors

  • Student Browsing: Explore verified student profiles, filter by various criteria, and find causes that resonate.
  • Secure Donations: Make secure and seamless contributions.
  • Impact Tracking: See how donations are used and receive updates on student progress.

A robust verification process ensures trust and transparency for both students and donors.

How We Built It

FundMyStudy was developed using a modern, component-based architecture focused on performance, scalability, and user experience.

  • Frontend: Built with React, React Router DOM, Tailwind CSS, React Hook Form, and Zod. Lucide React was used for consistent iconography.
  • Backend & Database: Powered by Supabase with PostgreSQL, managing profiles, campaign data, and activity logs. RLS ensures secure, role-based access control.
  • Authentication: Managed by Firebase Authentication for sign-up/login, password reset, and verification.
  • Development & Deployment: Vite for development; ready for deployment on Netlify with CI/CD support.

Careful planning was done for schema design, custom UI components, and integration between Firebase and Supabase with full RLS support.

Challenges We Ran Into

🔐 Firebase and Supabase Integration

  • Firebase uses text-based UIDs; Supabase defaults to UUIDs.
  • We had to adjust schema to support Firebase UIDs as text, syncing authentication with profile data.

🛡️ Complex Row-Level Security (RLS)

  • Fine-tuning RLS policies for students, donors, admins, and anonymous users was complex.
  • Ensured visibility of public campaign data and restricted access to private profile details.

📝 Form Management for Rich Data

  • Managed deeply nested student profile data using React Hook Form and Zod.
  • Handled data conversion between frontend forms and Supabase’s schema.

🎨 User Experience Design

  • Created a custom UI from scratch with Tailwind CSS.
  • Delivered a production-quality look without third-party UI kits.

Accomplishments We're Proud Of

  • Seamless Firebase + Supabase Integration with reliable account linking and secure profile mapping.
  • Robust RLS Security ensuring fine-grained access control for every user role.
  • Modern, Responsive UI that’s both intuitive and visually polished across all devices.
  • Complete Core Features: student profile creation, donor browsing, and secure campaign management.
  • Efficient Database Design with JSONB fields for flexible data storage like documents and funding breakdown.

What We Learned

  • 💡 In-depth Supabase RLS design, debugging, and policy writing for a multi-tenant app.
  • 🔗 Cross-Service Integration with Firebase and Supabase, including UID syncing and data consistency.
  • 🧠 Advanced Form Handling with dynamic schemas and nested validation.
  • 🧱 Scalable Frontend Architecture built for maintainability and modular development.
  • ⚙️ Database Migrations taught us the importance of managing schema changes (especially changing ID types mid-project).

What's Next for FundMyStudy

  • 💳 Payment Gateway Integration (e.g., Stripe) for secure, direct donations and recurring contributions.
  • Enhanced Verification System for improved trust via automated/manual identity and document checks.
  • 💬 Messaging System to allow secure communication between students and donors.
  • 📊 Analytics & Reporting Dashboards for both students and donors.
  • 🛠️ Admin Moderation Tools for managing users, campaigns, and content.
  • 🌍 Community Features like leaderboards, student success highlights, and discussion forums.
  • 📱 Mobile Apps for iOS and Android to expand accessibility and reach.

Built With

  • and
  • and-css.-frameworks/libraries:-react-for-the-user-interface
  • and-lucide-react-for-icons.-build-tool:-vite-is-used-as-the-build-tool-and-development-server.-cloud-services/platforms:-firebase:-used-specifically-for-user-authentication.-supabase:-serves-as-the-backend-as-a-service
  • api
  • apis:
  • authentication
  • firebase
  • html
  • javascript
  • managed
  • providing-the-postgresql-database-and-potentially-other-services-like-user-profiles-and-activity-logging.-netlify:-used-for-deploying-and-hosting-the-web-application
  • react-hook-form-and-zod-for-form-management-and-validation
  • react-router-dom-for-navigation
  • supabase
  • supabase.
  • tailwind-css-for-styling
  • the-project-utilizes-a-combination-of-modern-web-technologies:-languages:-typescript
  • through
  • with-entri-facilitating-custom-domain-setup.-databases:-postgresql
Share this project:

Updates