Neon Vibes
A vibrant, high-energy e-commerce platform designed for a custom neon sign workshop. The goal was to translate the physical buzz of neon tubes into a digital retail experience.
The Kit
paletteTypography
Display/headings/buttons/nav
Sora
Aa Bb Cc Dd Ee Ff Gg 0123456789
Headings
Hanken Grotesk
Aa Bb Cc Dd Ee Ff Gg 0123456789
Body
Inter
Aa Bb Cc Dd Ee Ff Gg 0123456789
Colors
Build Notes
How I Built It
I used a Python scraper to pull all events from the official site and export them as a CSV, filtered by my own criteria. That data lives in Supabase, which handles the database and API layer. The frontend is built in Next.js and deployed on Vercel via GitHub. The interactive map runs on Leaflet.js. I used AI tools inside VS Code to help with the code, since development isn't my main background.
Data Prep
events = scrape_official_site() filtered = apply_my_criteria(events) csv = export_to_csv(filtered) supabase.table("events").upsert(csv) map = Leaflet(events + saved_likes)Architectural Flow
account_treeOfficial Site
Source events and raw programme data.
Python Scraper
Collect, filter, and export the events as CSV.
Supabase
Database plus API layer for the app.
Next.js UI
Filters, saved likes, and mobile-first screens.
Leaflet Map
Interactive map for zones and venues.
Frontend
Next.js handles the interface, filtering states, likes, and the mobile-first route structure.
Backend
Supabase stores the event database and exposes the API layer used by the frontend.
Workflow
GitHub connects the code to Vercel deployment, while AI tools inside VS Code helped me move faster through implementation.
Digital Experience
