Hi, I'm Marek!

Vibe-coded solution to my recent problem

Masaryk University offers a ginormous number of courses to pick from, but how do I find the ones that I'd like to take? Their tool searches in course names (too plain) or codes (useless). So I’m stuck crawling through multiple study programs course by course and reading courses individually until I find something interesting.⁣⁣

‍

So I built a semantic course search tool for MUNI Faculty of Arts. I type a learning goal in Czech, I get back 5 matched courses with AI-generated reasoning why each fits.

‍

⁣⁣Scoped as MVP – free Gemini models with very low limits, only two upcoming semesters, Czech queries only, no enrollment eligibility checks, no cross-faculty search, very basic UI. But it can actually find courses contextually tied to my goal.⁣⁣

Stack: Next.js, Gemini embeddings + Gemini Flash, Supabase pgvector.⁣

‍

Two problems that stood out from the rest:⁣

• The scraper fought back hard. ⁣IS MUNI uses CAPTCHA, session tokens that expire mid-run, AJAX pagination that ignores parameters, and a catalog structure where the same course appears dozens of times across study programmes. Each issue looked like a different bug. The fix was switching to a headed browser with manual CAPTCHA solve, a bulk API request per programme group, and deduplication by URL — and eventually migrating to IS's official Prezentátor XML export, an ancient inflexible dinosaur, which bypassed most of this entirely.⁣

• Gemini's free quota is a shared resource across the whole pipeline. Embedding 8,000 courses and serving live search queries draw from the same 1,000 requests/day limit. Hit it during embedding and it breaks search. This is kind of prevented with a per-run cap on the embed script (900 courses/day), paginated incremental runs, and proper quota error handling that tells the user in Czech what's wrong.

‍

A small interaction experiment for a hero section: the background image responds to the cursor with two custom GLSL shaders layered together — a gentle "pull toward cursor" distortion for an organic, liquid feel, and a chromatic aberration effect that only fringes the bright white structures in the image, leaving the grey field untouched.

‍

The interesting part was getting the aberration mask right: it reads pixel brightness to decide where to split the RGB channels, but because chromatic aberration is only visible where there's contrast, a naive threshold either missed the fine filament lines or bled color across the whole background. Tuned by sampling the actual image's luminance distribution rather than eyeballing it.

‍

Also had to get creative with distribution — Artifacts render in a sandboxed environment that blocks any request to an external host, so the background image couldn't just be linked by URL. Solved by embedding it directly as a base64 data URI, keeping the whole thing a single self-contained file that runs anywhere with no setup.

‍

Built as a fast, interactive prototype — no production polish, just proving the interaction feel before committing to it.