Problem
Pappersscorekortet ger ingen data att agera på. Golfare som vill förbättra sig behöver spåra puttar, GIR och fairway-träffar per hål och få feedback på vad som faktiskt kostade slag.
Lösning
Jag byggde en Next.js-app med ett hål-för-hål-formulär, localStorage-lagring utan konto, statistikdiagram, screenshot-import via Claude vision och en server-side AI-rutt som returnerar en strukturerad coachingrapport.
Tekniska beslut
API-nyckeln hålls enbart på servern via en Next.js-routehandler — aldrig exponerad i klienten.Zod-validering på både request och AI-response för att garantera strukturerad data.localStorage för att appen ska fungera utan backend eller konto.Dynamic import med ssr:false för WebGL-komponenter för att undvika SSR-problem.Render för enkel deployment av en fullstack Next.js-app.
Vad det visar
Projektet visar att jag kan bygga AI-integrationer på ett säkert och strukturerat sätt: rätt lager för rätt ansvar, utan att exponera känsliga nyckel eller returnera ovaliderad data.
Teknik
Next.js 16TypeScriptTailwind v4Anthropic SDKZodWebGLRender