Volunteering Project

UpliftX — Empowering Communities, One Volunteer at a Time

Volunteer management platform for event-based brands — register, assign roles, and coordinate.

UpliftX
Next.jsTypeScriptTailwindCSSSupabasePostgreSQLClerk APIExpress.jsVercel

UpliftX is a volunteer management platform built for event-based brands, enabling organizers to register volunteers, assign roles, and streamline event coordination. Find your purpose, build your network, and contribute to something truly special.

Features

  • Opportunity Search:: Volunteers can browse and search for work opportunities matching their skills and interests.
  • Application System:: Apply to volunteer positions with a streamlined application flow and status tracking.
  • Admin Dashboard:: Specialized dashboard for organizers to manage applications, opportunities, and volunteer data.
  • Role Assignment:: Assign specific roles to volunteers for efficient event coordination.
  • Rating System:: Rate and review volunteer performance after events.
  • Community Building:: Connect with other volunteers and organizations in the community.
  • WhatsApp Integration:: Quick group coordination via WhatsApp group links.
  • Authentication:: Secure sign-in with Clerk API for user authentication and management.

Tech Stack

  • Frontend:: Next.js with TypeScript (92.2% TypeScript codebase) and TailwindCSS.
  • Backend:: Node.js with Express.js for API routing and server-side logic.
  • Database:: Supabase (PostgreSQL) with custom SQL migrations for permissions, ratings, and opportunity management.
  • Auth:: Clerk API for secure authentication and user management.
  • Deployment:: Vercel with custom vercel.json configuration.

How to Use UpliftX

  • **As a Volunteer:**
  • Sign Up:: Create an account using Clerk authentication (Google / Email).
  • Browse Opportunities:: Explore available volunteer positions on the Opportunities page. Filter by event type, role, or location.
  • Apply:: Click on an opportunity that interests you and submit your application with a single click.
  • Track Status:: Check your Dashboard to see application statuses — pending, accepted, or completed.
  • Get Rated:: After completing a volunteer assignment, organizers rate your performance, building your reputation.
  • **As an Organizer:**
  • Create Opportunities:: Log in to the Admin Dashboard and create new volunteer opportunities with role descriptions, requirements, and event details.
  • Manage Applications:: Review incoming volunteer applications, accept or reject candidates, and assign specific roles.
  • Coordinate via WhatsApp:: Share WhatsApp group links with accepted volunteers for quick event-day coordination.
  • Rate Volunteers:: After the event, rate volunteer performance to help build community trust.

How I Built It

UpliftX was a freelance project — I built it for a client who needed a platform to manage volunteers across multiple events. The challenge was building something scalable enough to handle multiple organizations while keeping it simple for non-technical organizers.

I chose Next.js with TypeScript for the frontend (92.2% of the codebase is TypeScript) because I needed both server-rendered pages for SEO and dynamic client-side interactions for the dashboard. TailwindCSS handled all the styling.

The backend runs on Express.js with Node.js, handling API routes for volunteer applications, opportunity CRUD, and user management. For the database, I went with Supabase (hosted PostgreSQL) because it gave me real-time subscriptions, built-in auth helpers, and a generous free tier.

The trickiest part was the permissions system. I wrote custom SQL scripts (fix-admin-permissions.sql, fix_apply_now.sql, fix_delete_opportunities.sql, fix_rating_complete.sql) to handle row-level security in Supabase — making sure organizers can only manage their own events, volunteers can only see their own applications, and admins have full access.

Clerk API handles authentication, giving users Google and email sign-in out of the box with session management.

The project is deployed on Vercel with a custom vercel.json configuration for routing.

Architecture

The project follows a clean separation with Supabase handling the database layer including custom SQL scripts for admin permissions, application workflows, rating systems, and opportunity deletion logic.