Volunteer-Student Matching Platform

View on GitHub

Developed for MAD WISH, an initiative by It’s Raining Raincoats, this full-stack platform streamlines the matching of migrant workers in Singapore with volunteer English-language mentors. The application transforms a previously manual, spreadsheet-based process into an automated system that handles growing participant volumes while ensuring optimal student-teacher pairings based on compatibility factors.

It’s Raining Raincoats’ MAD WISH program faced a critical scaling challenge. Coordinators were manually matching migrant workers seeking to learn English with volunteer mentors using spreadsheets and emails—a process that became increasingly unsustainable as demand grew.

Key pain points included:

• Manual tracking of 200+ students and volunteers across multiple spreadsheets
• No systematic way to match based on native language compatibility, schedules, and experience
• Lack of visibility into matching status and teaching relationship progress
• Time-intensive volunteer screening and verification process
• No centralized system for coordinators to manage the entire workflow

The organization needed a scalable, user-friendly platform that could automate matching while maintaining the personal touch that made their program successful.

As a Full Stack Developer in a team of 5, I contributed across the entire application lifecycle:

• Database Design: Architected PostgreSQL schema with Knex.js migrations for students, teachers, matches, and status tracking
• API Development: Built RESTful endpoints for student/teacher CRUD operations, automated matching, and status workflows
• Matching Algorithm: Implemented intelligent pairing logic considering native language, availability, and teaching experience
• Frontend Development: Created responsive Vue.js components for profile management and matching interface
• Authentication: Implemented JWT-based auth with role-based access control for coordinators and admins
• Screening Workflow: Developed multi-stage volunteer verification process with status tracking

Frontend (Vue.js + Buefy):

• State Management: Vuex store for centralized student/teacher data and matching state
• Routing: Vue Router with navigation guards for authenticated routes
• UI Components: Buefy (Bulma-based) for responsive, accessible interface design
• Form Handling: Dynamic forms for profile creation with validation
• Match Interface: Intuitive drag-and-drop style matching workflow for coordinators

Backend (Node.js + Express):

• Database: PostgreSQL with Knex.js query builder and objection.js ORM
• Authentication: JWT tokens with bcrypt password hashing
• API Design: RESTful endpoints following best practices
• Status Workflow: Track students/teachers through Unmatched → Matched → Active → Completed lifecycle
• Testing: Unit tests with Jest for critical matching logic

• Smart Matching Engine: Algorithm pairs students with teachers based on native language, availability slots, and teaching experience
• Role-Based Access: Secure authentication with distinct views for coordinators, admins, and volunteers
• Profile Management: Comprehensive student/teacher profiles with language skills, preferences, and availability
• Status Tracking: Real-time visibility into matching status and teaching relationship progress
• Screening Workflow: Multi-stage volunteer verification with document upload and approval tracking
• Bulk Operations: Batch matching and status updates for efficient coordinator workflows

The platform transformed MAD WISH’s operations by replacing manual spreadsheet tracking with an automated system. Coordinators gained real-time visibility into the entire matching pipeline, while the intelligent pairing algorithm ensured better student-teacher compatibility based on language needs and schedules.

Key outcomes included:

• Reduced matching time from hours to minutes per batch
• Improved volunteer screening consistency through standardized workflow
• Enhanced data integrity with centralized PostgreSQL database
• Scalable architecture supporting program growth

This project was my first full-stack application built with modern JavaScript frameworks. I gained hands-on experience with Vue.js reactivity patterns, RESTful API design, and database normalization. Working in an agile team environment with code reviews and Git workflows prepared me for professional software development. Most importantly, I learned how technology can amplify social impact—this platform continues to help migrant workers access English education opportunities in Singapore.