Kevin Cano
Campus Flyer: Connecting Students with Employers

Case study · March 2024 – Present

Campus Flyer

Connecting Students with Employers

A full-stack job marketplace connecting students with local and national employers. Built on Next.js 16 and React 19, backed by Supabase Postgres with row-level security, authenticated with Clerk, and deployed on Vercel.

Founder and Full-Stack Developercampusflyer.com

150+

Active users

Stack

ReactJSNext.js 16React 19TypeScriptSupabasePostgreSQLClerkTailwind CSSshadcn/uiVercel

Overview

Campus Flyer is a two-sided marketplace connecting students with jobs and internships from local and national employers. Employers post roles, students browse and apply, and administrators moderate the platform. As founder and sole developer I own the entire stack: product, schema design, authorization model, front-end, and deployment.

Since launching in 2024, the platform has grown to more than 150 active users.

Architecture

The application runs on Next.js 16 with the App Router and React 19, written in TypeScript. Pages are React Server Components that query the database directly, and every mutation goes through a typed server action in app/actions, so no write path is exposed as a public API endpoint. Route groups separate the student, employer, and admin experiences behind Clerk middleware, with only the landing page, legal pages, and shared opportunity pages left public.

Clerk handles authentication and sessions. Supabase Postgres holds the data, and the server-side Supabase client forwards the Clerk token so row-level security policies resolve the caller from the JWT. Identity lives in Clerk, authorization lives in Postgres, and there is exactly one place that decides what any user can read.

Every table has RLS enabled. Students only read their own applications and saved jobs, employers only read applications submitted to jobs they own, and those rules are enforced by the database rather than by UI checks. Privileged columns are writable only by the service role, security-definer helpers run with a pinned search_path, and a policy blocks users from granting themselves the admin role on insert.

Vercel hosts the platform with continuous deployment and preview environments. A tuned Content Security Policy plus HSTS, X-Frame-Options, Referrer-Policy, and Permissions-Policy headers ship with every response.

Key Features

  • Job discovery with map search: Students filter by keyword, job type, pay, and remote status, then sort by distance from their school or hometown using Leaflet maps and haversine distance, with an interest match score ranking roles against their stated interests.
  • School verification: Students who sign up with a school email address are verified automatically by matching their Clerk-verified primary email against the registrable domain of the school they selected, with no code step required.
  • Shareable public listings: Any published job has a public page with generated metadata for link previews and search indexing. Rather than opening the tables to anonymous readers, a security-definer function returns only the safe public fields, so employer contact details are never exposed.
  • Employer applicant pipeline: Employers post roles, track applicants through status changes, and review student profiles and resumes served from access-controlled Supabase Storage buckets.
  • Admin moderation: A dedicated admin surface for managing users, jobs, applications, and saved records, including account suspension enforced at the data layer rather than in the UI.
  • External data integration: School lookup through the College Scorecard and NCES APIs and address geocoding through OpenStreetMap Nominatim, both behind rate-limited internal API routes with cached responses.

Technologies Used

  • Next.js 16 and React 19: App Router, React Server Components, and server actions in TypeScript.
  • Supabase (PostgreSQL): Schema design, row-level security policies, security-definer functions, and access-controlled storage buckets.
  • Clerk: Authentication, session management, route protection, and school email verification.
  • Tailwind CSS v4 and shadcn/ui: Component system and design primitives, with Radix UI under the hood.
  • Leaflet, TanStack Table, and Recharts: Map search, admin data tables, and dashboard charts.
  • Vercel: Hosting, CI/CD, and preview deployments.

Challenges and Learnings

The most instructive work was designing authorization. Moving access control out of application code and into row-level security meant reasoning carefully about every path a query could take, including the joins an employer needs to see applicants without being able to read the rest of the profiles table. It produced a system where a missed check in the interface cannot become a data leak, because the database refuses the query no matter which client sends it.

The public sharing feature made that tradeoff concrete. Letting anonymous visitors view a shared listing without exposing employer contact details or student PII meant building a narrow security-definer function that returns exactly the public fields, instead of relaxing the policies on the underlying tables.

The other challenge was migrating a live platform and its existing users onto a new stack without disrupting the people already relying on it, which meant remapping the data model and moving accounts onto Clerk before cutting over.

Outcome

Campus Flyer serves an active community of more than 150 students and employers on a foundation that is fast to iterate on and secure by default at the data layer.

The project demonstrates full-stack ownership end to end: product definition, relational schema and policy design, authentication and authorization, server-rendered React, third-party API integration, and continuous deployment, applied to a real platform with real users.

Next project

Compo Technologies