Hopp til innhold
Personlig Roadmap
Prosjektplan · Intern · dashboard.minth.no

dashboard.minth.no

Et personlig AI-drevet forbruks- og kostholdsdashboard bygget over det eksisterende n8n-oppsettet.

Next.jsApp RouterTypeScriptTailwind CSSshadcn/uiRechartsDockernginxLet's Encryptn8nGoogle SheetsOpenAITelegram

1Arkitektur og dataflyt

Dashboardet er et rent lesevindu inn i data som allerede samles inn og struktureres av n8n. All tunge databehandling — OCR, kategorisering og lagring — skjer i n8n-flyten, ikke i Next.js-applikasjonen.

Telegram
n8n
OCR
GPT-kategorisering
Google Sheets
Next.js-dashboard

2Sikkerhet i v1

v1 er bygget for én bruker, ikke for offentlig tilgjengelighet. Sikkerheten reflekterer det — enkel, men bevisst.

  • Ingen offentlig registrering — dashboardet er kun for personlig bruk.
  • Enkel, delt hemmelighet (miljøvariabel) beskytter API-rutene i v1, ikke et fullt brukersystem.
  • All trafikk går over HTTPS via nginx og Let's Encrypt, aldri ukryptert.
  • n8n-webhooks valideres mot en hemmelig token før data behandles videre.
  • Ingen API-nøkler eller hemmeligheter committes til Git — alt ligger i miljøvariabler på VPS-en.
  • Google Sheets-tilgang skjer via en dedikert service-konto med minimale rettigheter.

3Mappestruktur

dashboard-minth/
dashboard-minth/
├── src/
│   ├── app/
│   │   ├── (dashboard)/
│   │   │   ├── page.tsx
│   │   │   ├── okonomi/
│   │   │   ├── kosthold/
│   │   │   └── radgiver/
│   │   └── api/
│   │       ├── summary/route.ts
│   │       ├── transactions/route.ts
│   │       ├── categories/route.ts
│   │       ├── trends/route.ts
│   │       ├── health/route.ts
│   │       └── chat/route.ts
│   ├── components/
│   │   ├── dashboard/
│   │   ├── charts/
│   │   └── ui/
│   ├── lib/
│   │   ├── sheets.ts
│   │   └── openai.ts
│   └── types/
└── docker-compose.yaml

4Komponentstruktur

SummaryCards

Nøkkeltall for måneden: totalt forbruk, kategorifordeling, avvik fra budsjett.

TransactionsTable

Filtrerbar, paginert liste over registrerte transaksjoner.

CategoryChart

Kakediagram eller stolpediagram over forbruk per kategori, bygget med Recharts.

TrendChart

Linjediagram som viser utvikling over tid per kategori.

ChatPanel

Grensesnitt mot AI-rådgiveren, bygget på /api/chat.

HealthBadge

Statusindikator som viser om n8n-flyten og datakildene er friske.

5Sideoppsett

  • /Oversikt med nøkkeltall og siste transaksjoner.
  • /okonomiDetaljert forbruksoversikt, kategorier og trender.
  • /kostholdRegistrerte måltider og ernæringsoversikt hentet fra samme datastrøm.
  • /radgiverAI-drevet chat som svarer på spørsmål om egen økonomi og kosthold.

6API-endepunkter

  • GET/api/summary

    Aggregerte nøkkeltall for valgt periode.

  • GET/api/transactions

    Liste over transaksjoner med filtrering og paginering.

  • GET/api/categories

    Tilgjengelige kategorier og deres nøkkeltall.

  • GET/api/trends

    Tidsseriedata for forbruk per kategori.

  • GET/api/health

    Statussjekk for datakilder og n8n-integrasjon.

  • POST/api/chat

    Sender en melding til AI-rådgiveren og returnerer svaret.

7n8n-siden

Fem sammenkoblede steg i n8n dekker hele inntaksflyten før data noen gang når dashboardet.

  • Kvitteringsinntak

    Telegram-bot mottar bilde av kvittering og sender den videre til n8n.

  • OCR og tolkning

    n8n kjører bildet gjennom en OCR-tjeneste for å hente ut rå tekst.

  • GPT-kategorisering

    Rå tekst sendes til OpenAI for å strukturere beløp, butikk og kategori.

  • Lagring i Google Sheets

    Strukturert data skrives til et regneark som fungerer som datakilde i v1.

  • Feilhåndtering

    Ved usikker tolkning sender n8n en oppfølgingsmelding til Telegram i stedet for å gjette.

8Drift på VPS-en

Dashboardet deployes som en egen Docker-container ved siden av n8n på samme VPS, og eksponeres via nginx som reverse proxy med et eget Let's Encrypt-sertifikat for dashboard.minth.no. Ingen porter eksponeres direkte — all trafikk går gjennom nginx.

9Byggerekkefølge

1

n8n-webhooks

Mål: Etablere en pålitelig inntaksflyt fra Telegram til Google Sheets.

n8nTelegramOpenAIGoogle Sheets

En kvittering sendt i Telegram dukker opp korrekt kategorisert i regnearket.

2

Produksjonsskjelett

Mål: Sette opp Next.js-prosjektet med Docker, nginx og subdomene i produksjon.

Avhengigheter: n8n-webhooks

Next.jsDockernginxLet's Encrypt

dashboard.minth.no svarer med en tom, men deployet Next.js-side over HTTPS.

3

Forside

Mål: Bygge oversiktssiden med nøkkeltall hentet fra Google Sheets.

Avhengigheter: Produksjonsskjelett

Next.jsTailwind CSSshadcn/ui

Forsiden viser reelle, oppdaterte nøkkeltall fra regnearket.

4

Økonomi

Mål: Bygge detaljert forbruksoversikt med filtrering, tabell og grafer.

Avhengigheter: Forside

Recharts/api/transactions/api/trends

Kan filtrere transaksjoner på kategori og periode, og se trender over tid.

5

Kosthold

Mål: Utvide datastrømmen til også å dekke måltidsregistrering.

Avhengigheter: Økonomi

n8nGoogle SheetsNext.js

Registrerte måltider vises samlet med enkel ernæringsoversikt.

6

AI-rådgiver

Mål: Bygge chat-grensesnittet som svarer basert på egen økonomi- og kostholdsdata.

Avhengigheter: Kosthold

OpenAI/api/chat

Rådgiveren svarer korrekt på konkrete spørsmål om forbruk siste måned.

10Vei mot SaaS

v1 er bevisst bygget for personlig bruk. Skulle det noen gang bli aktuelt å tilby dette til andre, er dette de nødvendige stegene:

  • Bytte Google Sheets ut med en ekte database (PostgreSQL) som datalag.
  • Innføre ekte brukerkontoer og autentisering i stedet for delt hemmelighet.
  • Isolere data per bruker/tenant i databaseskjemaet.
  • Gjøre n8n-flyten konfigurerbar per bruker fremfor hardkodet for én person.
  • Legge til fakturering dersom prosjektet noen gang skulle tilbys andre.