Skip to content
H
All projects

Systems · Full-Stack Developer

Planna

A full-stack academic course planner for grades 6–12+ built with React 18, TypeScript, Vite, Tailwind CSS, and Supabase — enabling students to create, edit, and track multi-year course plans with a live catalog, drag-and-drop scheduling, and a VATTIS program-stream grid.

View repository

Highlights

  1. 01

    Delivered a full-stack multi-year academic course planner for grades 6--12+ (0 → 4 shipped phases) as a Vite + React 18 + TypeScript + Tailwind SPA against Supabase Postgres, supporting multiple named plans with full semester-level course assignment and persistence.

  2. 02

    Reduced planning friction with a drag-and-drop semester grid by integrating @dnd-kit/core + @dnd-kit/sortable into the plan editor, supporting add / remove / reorder / cross-semester move with confirmation dialogs and graceful revert-on-cancel.

  3. 03

    Designed a Supabase Postgres schema with row-level security (plans + plan_items, per-user RLS, anonymous auth on first use) plus live catalog seeding and a VATTIS program-streams × semesters grid populated from live plan state.