planetmax.dev
This site is its own project. A frontend experiment built to explore patterns I don't work with regularly and serve as a hub for documenting various projects publicly as well as a gated environment for personal tools. Some features to highlight include 3D rendering in the browser, statically compiled content pipelines, streaming LLM APIs, and a coding assistant first codebase design capable of staying coherent and working efficiently across growing features. Built with Next.js 14, MDX/Velite for content, Supabase for auth and database, deployed on Vercel Edge. Some highlights include...
Travel globe
The travel page centres on an interactive globe: a sphere textured with a NASA image, slow auto-rotation when idle. Built with React Three Fiber and dynamically imported (Three.js runtime only loads if the page is visited).
Continent filtering — selecting a continent tag rotates the globe to that region along the shortest angular path, interpolated in spherical coordinates while the stats block updates to reflect the filtered count.
Country data — each travel detail page includes a // data · [country] section pulled at build time from Our World in Data: population trend, GNI per capita, Gini coefficient, median age, democracy index, and others. Rendered as labelled rows with 64×16 px SVG sparklines.
3D CAD viewer
Interactive 3D model previews can be embedded directly in project pages. The model below is the full CNC plasma cutter assembly — rotate and zoom with mouse or touch.
Getting large assemblies onto the web without destroying load times uses this piepline:
Native CAD → STL — geometry exported from the CAD environment.
Blender — STL imported,materials applied per sub-assembly, then exported as GLB (binary GLTF — geometry and materials in a single file).
Draco compression — Uses Draco, a mesh compression library, for a 97% reduction with no visible quality loss using gltf-transform input.glb output.glb
Private LLM console
Behind Supabase auth sits a private multi-model LLM interface.
Models — Claude Opus, Claude Sonnet, GPT-4o, GPT-4o Mini, Gemini Flash — all driven through Vercel AI SDK's unified streamText API.
Persistence — Supabase stores conversations as JSONB with row-level security enforced at the database layer. Auto-saved on first message, titled from the opening 60 characters.
This will be extended in future with a model evaluation suite.
Performance details
Hover prefetching — home page module tiles use prefetching so that by the time a click registers, Next.js has already fetched the destination bundle.
Static generation — all public content routes are pre-rendered at build time.