Stack

TypeScript, React och PostgreSQL.

När du bygger i Lovable får du en app i React och TypeScript, med PostgreSQL via Supabase som databas. Det är samma stack som jag jobbar i varje dag. Därför kan jag läsa koden Lovable har skrivit, hitta det som läcker och fixa det.

Boka en genomgång

Så är en Lovable-app byggd

Fyra lager. Lovable skriver alla.

Varje lager är kod du äger. Jag går igenom dem ett i taget.

React

Lovable genererarSidor, formulär och inloggning.

Jag granskarVad som visas för vem.

TypeScript

Lovable genererarTyper för tabeller och anrop.

Jag granskarAtt typerna stämmer med databasen.

supabase-js

Lovable genererarAnropen från webbläsaren till databasen.

Jag granskarVilka nycklar som skickas och vart.

PostgreSQL

Lovable genererarTabeller och RLS-regler.

Jag granskarAtt reglerna faktiskt stoppar.

Följ en request

Från klick till databas och tillbaka.

Så här går en fråga när din app hämtar kunder. På varje station kan något läcka.

  1. supabase.from("kunder").select("*")
  2. GET /rest/v1/kunder?select=* Authorization: Bearer …
  3. role: authenticated · auth.uid() = 7f3c…
  4. select * from kunder
  5. policy "egen data": user_id = auth.uid()
  6. ← 200 · 2 rader
Svaret är tillbaka i webbläsaren

Där RLS stoppar

Samma fråga. Olika svar.

Med en RLS-policy bestämmer databasen själv vem som får se vilka rader. Den som inte är inloggad får inget. Den som är inloggad ser sina egna.

create policy "egen data" on kunder using (auth.uid() = user_id);
Anonymmed policy

select * from kunder;

  • Anna BergVäxjö
  • Erik LundKalmar
  • Anna Berg ABVäxjö
  • Sara EkLjungby
  • Jonas HolmAlvesta
0 rader
Inloggad som anna@exempel.semed policy

select * from kunder;

  • Anna BergVäxjö
  • Erik LundKalmar
  • Anna Berg ABVäxjö
  • Sara EkLjungby
  • Jonas HolmAlvesta
2 rader

TypeScript fångar felet

Felet syns innan kunden ser det.

Ett stavfel i ett fältnamn blir ett tomt fält i produktion. Med rätt typer stoppar TypeScript det redan när koden skrivs.

const { data } = await supabase.from("kunder").select("id, namn, epost");
skickaMejl(data?.[0]?.epost);

// fångat innan körning: Property 'email' does not exist on type '{ id: number; namn: string; epost: string; }'.

Inga typfel

Det här kräver Supabases genererade typer. Lovable skapar dem åt dig, men de måste hållas i takt med databasen.

Det kanske inte är något fel alls.

Då vet du det. Och då har du ett papper på att någon har kollat.

Boka en genomgång