Inspiration
I needed service hours, and every listing I found was sorting papers or sending envelopes. Meanwhile, I'm good at coding and digital design, and a company near me kept asking on Instagram for someone to make a landing page for their website. They needed exactly what I could do, and neither of us knew the other existed.
That gap is everywhere. 92% of U.S. nonprofits run on budgets under $1 million (National Council of Nonprofits), so they can't hire designers, developers or translators. Formal volunteering fell from 30% to 23% of Americans between 2019 and 2021 (AmeriCorps). Meanwhile, students need service hours for graduation, honor societies and college, and many already have the exact skills these organizations are missing. Volunteer sites list generic shifts, show everyone the same list, and leave hours on paper forms.
What it does
Handraise matches what students are good at to real projects at places near them, then turns the work into verified service hours. Raising your hand is the universal sign for "I'll help."
For students (ages 13–25)
- List your skills, what you want to learn, the causes you care about and your weekly time.
- See projects ranked by fit, with the reasons spelled out: "You know graphic design · You care about hunger · Fits your 4 hours a week · 3 miles away."
- Only see projects you're old enough for and within the distance you choose.
- Apply, do the work, log hours, and download a certificate of verified hours.
For organizations
- Describe a need in plain words, like "our flyers are plain and I barely post on Instagram." The project builder turns it into a clear, student-sized project with skills, hours, timeline and deliverables, and highlights the words it used.
- Review applicants ranked by fit, accept with one click, and verify hours in seconds.
Places to volunteer near you
Handraise lists 100 real organizations in 23 states, DC, and online. Alongside food banks and animal shelters, it includes public libraries, parks departments, hospitals, museums, and government programs like NASA GLOBE Observer. Each listing is labeled by place type and shows its address, distance, and website. Students can filter by kind. Real organizations are clearly marked as example listings that link to their own volunteer pages.
Impact dashboard
Live verified hours and their dollar value. A skills gap chart shows which skills organizations need that students don't have yet, so a school club knows which workshop to run.
Try it without an account
The How it works page lets anyone play with the matching engine and the project builder: handraise-app.netlify.app
How I built it
- Frontend: plain HTML, CSS and JavaScript with no framework or build step. It includes light and dark mode, keyboard navigation, a skip link, and layouts that work on phones.
- Backend: Supabase (Postgres and Auth) with row-level security on every table. The database itself enforces the rules: students can only log hours on projects that accepted them, only the organization can verify hours, organizations only see their own applicants, and nobody under 13 can sign up.
- Sign-in: email and password, or Continue with Google (OAuth with PKCE).
- Matching engine: hard rules first (age limit, distance radius, remote-only), then a weighted score:
$$\text{fit} = 0.50 \cdot \text{skills} + 0.20 \cdot \text{cause} + 0.15 \cdot \text{time} + 0.10 \cdot \text{distance} + 0.05 \cdot \text{growth}$$
- Related skills: a skills graph gives partial credit, so a designer gets half credit on a social media project instead of zero. Every point of the score maps to a plain-English reason.
- Distance: the haversine formula on latitude and longitude, with a 10, 25, 50 or 100 mile radius the student picks.
- Project builder: phrase detection (a simple form of natural-language processing) over about 140 phrases across 17 skills. It estimates hours and timeline and shows the evidence it used.
- Data pipeline: Node scripts geocode every address with OpenStreetMap Nominatim and load every website to make sure it's live.
- Testing: 16 automated tests for the matching rules and project builder, plus a 16-step database test. It runs a simulated student and organization through sign-up, posting, applying, accepting, logging and verifying, and checks that cheating is blocked. Then it rolls everything back.
- Hosting: Netlify.
Challenges I ran into
- Making hours trustworthy. Hiding a "Verify" button isn't security, because anyone can open the browser console. I wrote row-level security policies and tested that students can't accept themselves, verify their own hours, or log hours before being accepted.
- Fair matching. Exact keyword matching hid good projects from students with related skills, so I built the related-skills graph.
- Plain language is messy. "Food drive" kept being read as event planning, and "video call" as video production. I tuned the vocabulary against realistic descriptions and wrote tests for those cases.
- Real data. My script caught a renamed organization and a moved website. Some sites block automated checks, so I didn't scrape around them.
- Protecting minors. Location is opt-in and stored rounded to about 1 km. Only first names are shown, and organizations never see a student's location.
Accomplishments that I'm proud of
- A working two-sided marketplace with real accounts: apply → accept → log hours → verify → certificate.
- Security enforced by the database, not just the interface.
- An organization can go from a frustrated sentence to a published project in about 30 seconds.
- 100 real places to volunteer, with every address geocoded and every website checked.
What I learned
- How authentication and row-level security work, and why you never trust the browser.
- How recommendation systems balance several factors, and why explaining a score builds trust.
- The basics of natural-language processing.
- How to design one product for two very different users: teenagers and busy nonprofit directors.
What's next for Handraise
- Pilot with a local organization and a school service club.
- Parent consent for students under 18, and school email sign-in.
- A counselor view so schools can accept Handraise certificates directly.
- Learn the matching weights from which matches lead to finished projects.
- A Spanish-language interface.
Built with AI assistance
I built Handraise with Claude (Anthropic) as an AI coding assistant, which debugged much of the code when I ran into errors. I chose the problem and features, wrote the code, directed and reviewed the work, tested every flow, and can explain how each part works.
Built With
- chart.js
- css3
- google-oauth
- html5
- javascript
- netlify
- node.js
- openstreetmap
- postgresql
- supabase