Lagre data på en enkel måte
Fra lokal lagring til en ekte database.
Lagre data på en enkel måte er en gratis leksjon i Vibe-koding på CoddyKit. Dette er leksjon 3 av 4. Du kan lese valgfritt 3 leksjoner fra denne læringsstien gratis i sin helhet – deretter låser CoddyKit PRO opp alle leksjoner, samt praktisk øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i Vibe-koding, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i Vibe-koding inneholder totalt 4 leksjoner.
Data som blir værende
De fleste apper trenger å huske ting: gjøremålslisten, lagrede notater og innstillingen for mørk modus. Uten lagring forsvinner alt når De oppdaterer siden.
Den gode nyheten er at De kan gå fra «husker ingenting» til «husker alt» bare ved å beskrive hva som skal lagres — AI håndterer lagringskoden.
Lagringstrappen
Det finnes flere nivåer av lagring, fra det enkleste til det kraftigste. Start lavt, og gå opp bare når De trenger det:
- I minnet — raskt, men glemmes ved oppdatering
- Lokal lagring — lagres i brukerens nettleser og overlever oppdatering
- En database — delt mellom enheter og brukere, den virkelige løsningen
Hvis De forteller AI hvilket trinn De ønsker, holder De appen så enkel som mulig.
Lagre i nettleseren
Den enkleste varige lagringen er localStorage — en liten notatbok som nettleseren oppbevarer for appen Deres. Den passer perfekt for innstillinger og små lister på én enhet.
De trenger verken server eller konto for dette. En instruksjon som den nedenfor legger det til med én gang.
Make my to-do list save to the browser's
localStorage so my tasks are still there after I
refresh the page. Load them automatically when the
page opens.Slik fungerer localStorage
localStorage lagrer tekst under et navn (en «key»). Hvis De vil lagre objekter eller lister, gjør De dem først om til JSON-tekst, og gjør dem tilbake igjen ved lesing.
Kjør dette for å se mønsteret AI bruker: lagre en verdi, og les den deretter tilbake.
const settings = { theme: 'dark', fontSize: 16 };
const saved = JSON.stringify(settings);
console.log('Saved text:', saved);
const loaded = JSON.parse(saved);
console.log('Theme is:', loaded.theme);Når localStorage ikke er nok
localStorage finnes bare i én nettleser på én enhet. Hvis De vil at brukere skal se dataene sine på både telefonen og den bærbare datamaskinen, eller dele data mellom brukere, trenger De en database på en server.
Det høres kanskje skummelt ut, men verktøy gjør det enkelt. De beskriver hva som skal lagres, og AI setter opp databasekallene.
Enkle databaser for vibe-kodere
De trenger ikke å drifte Deres egen server. Driftede databaser gir Dem lagring med nesten ingen konfigurering:
- Supabase — en brukervennlig database med innebygd innlogging, godt egnet sammen med AI-verktøy
- Firebase — Googles sanntidsdatabase
- Airtable — et regneark som fungerer som en database
Verktøy som Bolt, Lovable og Replit kan koble til disse for Dem når De ber om det.
Legge til en database med en instruksjon
For å legge til ekte lagring beskriver De hva som skal lagres, og hvor. Når De nevner Supabase (et populært valg), forteller De AI nøyaktig hvilket oppsett den skal generere.
Denne instruksjonen gjør en app som bare fungerer lokalt, om til en app med en delt og varig database.
Connect this app to Supabase. Create a table called
notes with columns: id, title, content, and
created_at. Update the app so saving a note inserts
a row, and the homepage loads all notes from the
table, newest first.Tenke i tabeller
En database lagrer data i tabeller — omtrent som regneark med navngitte kolonner. En tabell kalt «notes» kan ha en tittel, et innhold og en dato. Hvert lagrede notat er én rad.
De trenger ikke å beherske databasedesign. Fortell bare AI hvilke felt hver ting har, så bygger den tabellen for Dem.
Opprette, lese, oppdatere, slette
Nesten alle dataapper gjør fire ting, ofte kalt CRUD: oppretter nye elementer, leser dem, oppdaterer dem og sletter dem. Hvis appen Deres kan gjøre alle fire, er den et ekte verktøy.
De kan be AI om å legge dem til én om gangen og teste hver enkelt før De går videre.
Add full editing to my notes app: I should be able
to create a note, edit an existing note's title and
content, and delete a note with a confirm dialog.
Keep everything saved to Supabase.Start enkelt, oppgrader senere
Det profesjonelle valget er å starte på det laveste trinnet som fungerer. Bygger De en rask prototype? Bruk localStorage. Trenger De den på alle enheter? Gå opp til en database. AI kan til og med migrere appen for Dem — «bytt appen min fra localStorage til Supabase».
Unngå å overkonstruere tidlig. Tilpass lagringen til det appen faktisk trenger i dag.
My app currently uses localStorage. Migrate it to
use Supabase instead so my data syncs across
devices, and move any existing local data into the
database on first load.Sikkerhetskopier og unngå datatap
Data er verdifulle — brukere blir frustrerte hvis de forsvinner. Driftede databaser som Supabase og Firebase tar sikkerhetskopier for Dem, noe som er enda en grunn til å gå videre fra localStorage for alt som er viktig.
De kan også la brukerne eksportere sine egne data som en sikkerhetsordning. Be AI legge til sikkerhetskopiering med ett klikk, slik at ingen mister arbeidet sitt.
Add a "Download backup" button that exports all my
notes from the database as a JSON file, and an
"Import backup" option that restores them. This
way users never lose their data.Kort sjekk
De har laget en notatapp som bruker nettleserens localStorage. En bruker klager over at notatene ikke vises når appen åpnes på telefonen. Hvilken type lagring trenger brukeren egentlig?
Oppsummering: Lagre data på en enkel måte
De har lært om lagringstrappen: først i minnet, deretter localStorage for varig lagring på én enhet, og til slutt en ekte database for delte data på tvers av enheter.
De har sett hvordan innstillinger lagres i nettleseren, når De bør oppgradere til driftede databaser som Supabase, hvordan data organiseres i tabeller, og hvilke CRUD-handlinger alle dataapper trenger. Start enkelt, og la AI oppgradere løsningen. Neste tema er å holde API-nøkler og hemmeligheter sikre.
Lær deg JavaScript med en AI-veileder – gratis
Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.
- Kurs
- 25
- Leksjoner
- 100
Ofte stilte spørsmål
Er leksjonen «Lagre data på en enkel måte» gratis?
Ja – du kan lese valgfritt 3 av leksjonene i læringsstien Vibe-koding, inkludert «Lagre data på en enkel måte», gratis i sin helhet her på nettet. Deretter låser CoddyKit PRO opp alle leksjoner, samt interaktiv øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Kurset i Vibe-koding inneholder totalt 4 leksjoner.
Hva lærer jeg i «Lagre data på en enkel måte»?
Fra lokal lagring til en ekte database. Du øver på Vibe-koding med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.
Trenger jeg erfaring for å begynne med Vibe-koding?
Ingen tidligere erfaring er nødvendig. Vibe-koding på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 3 av 4.
Hvor lang tid tar leksjonen «Lagre data på en enkel måte»?
De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.
Kan jeg skrive og kjøre kode i denne Vibe-koding-leksjonen?
Ja. Alle Vibe-koding-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.
Alle leksjonene i dette kurset
- Snakke med API-er
- Lese og lagre filer
- Lagre data på en enkel måte
- Håndtere hemmeligheter og nøkler