Salong Iluma
Salong Iluma är en egenbyggd demo, inte ett kundcase. Den använder samma React 18 + TypeScript + Vite SPA-bas som de andra demon (Tailwind, shadcn/ui, React Router, TanStack Query, react-hook-form, zod, Vitest), byggs till statiska filer och serveras med Nginx i Docker. Det är den mest utbyggda av de fyra: framer-motion, The Seasons via lokal @font-face, Mapbox GL + react-map-gl, ogl WebGL-aurora i hero-sektionen, react-helmet-async för SEO och behandlingssidor med slug. Inga Google Fonts via CDN.
TL;DR
En React + Vite-demo för salong med egna typsnitt, Mapbox, WebGL-aurora och react-helmet-async SEO, levererad som statiska filer via Nginx i Docker. Resultat: En live-demo för salong som kombinerar bokningsfokus med Mapbox, WebGL och tydligare SEO-standarder.
Konceptwebb
Utvecklingstid
Solo
Samarbete
Lyckat
Resultat
100%
Kundnöjdhet
Utmaningen
Lokala salonger behöver en sajt som känns personlig och premium, men fortfarande laddar bra på mobil. Många mallar blir generiska eller tungrodda när kartor, motion och egna typsnitt kommer in.
Min lösning
Jag byggde vidare på den gemensamma Vite + React + shadcn SPA:n med framer-motion, lokalt displaytypsnitt, Mapbox och en ogl-baserad hero-effekt, plus react-helmet-async för tydligare SEO. Leveransen är fortfarande frontend: statiska filer bakom Nginx i Docker.
Tekniska funktioner
Byggt med moderna tekniker och beprövade metoder för stabilitet och prestanda
Teknikstack
Moderna tekniker och ramverk för bra prestanda
Säkerhet och kvalitet
Byggt med säkerhetsrutiner och kvalitetssäkring
Ren arkitektur
Tydlig kodstruktur enligt branschpraxis
Prestanda
Optimerat för snabbhet, skalbarhet och användarupplevelse
Nyckel funktioner
Varm salongsidentitet med The Seasons via lokal @font-face
Hero med WebGL-aurora byggd med ogl
Kontaktkarta med Mapbox GL och react-map-gl
react-helmet-async plus Open Graph och Twitter-meta i index.html
Behandlingsrutter med slug-sidor för tjänstedetaljer
Statisk build via Nginx i Docker (npm ci i image-bygget)
Projekt galleri
Utvalda skärmdumpar från projektet.
Tekniker
Relaterade artiklar
Projektets resultat
Salongsägare kan bläddra i ett live-exempel som visar bokningsflöde, kartkontakt och en rikare visuell stack utan att det presenteras som ett betalt kundcase.