Back to projects
Hackathon Winner1st Place, Coherence 2026 Hackathon

EduAble

Accessible education platform — 1st Place, Coherence 2026

Next.js 16React 19Express/NodeMongoDBGCP Storagen8nWebAssembly FFmpegTailwindshadcn/ui

The Problem

Educational content needs to be accessible across formats — video, audio, text. Server-side processing is expensive at scale and introduces latency. The challenge was building an accessibility-first platform that could transform media without backend compute costs.

Architecture

Next.js 16 frontend with React 19 server components. Express/Node API for data persistence with MongoDB. GCP Storage for media assets. The key architectural decision: WebAssembly FFmpeg running entirely in the browser for video and audio processing.

Key Decisions

1

Used WebAssembly FFmpeg for client-side processing instead of server-side — eliminated compute costs entirely and reduced processing latency by moving work to the user's machine.

2

Built on Next.js 16 with React 19 to leverage server components for initial page loads while keeping interactive elements client-side.

3

Chose MongoDB over PostgreSQL for flexible schema evolution during rapid hackathon development.

Outcome

Won 1st Place at Coherence 2026 Hackathon. The WebAssembly approach proved the viability of client-side media processing for accessibility tooling.