JavaScript Academy · Les

Een database openen

Maak databases en object stores.

Les 1 van 413 stappen

Een database openen is een gratis JavaScript Academy-les op CoddyKit. Dit is les 1 van 4. Je kunt 3 lessen uit dit leerpad gratis volledig lezen — daarna ontgrendelt CoddyKit PRO alle lessen, plus praktische oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject JavaScript Academy. Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus JavaScript Academy bevat in totaal 4 lessen.

Wat is IndexedDB?

IndexedDB is een database met grote opslagcapaciteit en transacties die in de browser is ingebouwd. In tegenstelling tot localStorage (klein, alleen voor tekenreeksen en synchroon) slaat deze gestructureerde objecten op, ondersteunt deze indexen en werkt deze asynchroon.

Een database openen

Je opent of maakt een database met indexedDB.open(name, version). Dit retourneert een verzoekobject waarvan de gebeurtenissen succes of mislukking melden.

const request = indexedDB.open('notes-db', 1);

De gebeurtenissen van het verzoek

Een openverzoek activeert gebeurtenissen die je afhandelt:

  • onsuccess — de database is gereed
  • onerror — het openen is mislukt
  • onupgradeneeded — het schema moet worden aangemaakt of bijgewerkt
request.onsuccess = (e) => {
  const db = e.target.result;
  console.log('database opened');
};
request.onerror = (e) => {
  console.log('open failed:', e.target.error);
};

onupgradeneeded

onupgradeneeded wordt uitgevoerd wanneer de database voor het eerst wordt gemaakt of het versienummer hoger wordt. Dit is de enige plek waar je het schema kunt wijzigen (objectopslagen en indexen maken of verwijderen).

request.onupgradeneeded = (e) => {
  const db = e.target.result;
  // create object stores here
};

Objectopslagen

Een objectopslag lijkt op een tabel: een container voor records. Maak er een met db.createObjectStore(name, options) binnen onupgradeneeded.

request.onupgradeneeded = (e) => {
  const db = e.target.result;
  db.createObjectStore('notes', { keyPath: 'id' });
};

De keyPath

keyPath geeft aan welke eigenschap van elk object de primaire sleutel is. Opgeslagen objecten moeten die eigenschap hebben en sleutels moeten uniek zijn.

db.createObjectStore('users', { keyPath: 'email' });
// Each stored user object must have a unique 'email'.

Automatisch oplopende sleutels

Als je objecten geen natuurlijke sleutel hebben, kun je IndexedDB er een laten genereren met autoIncrement: true. Elk nieuw record krijgt het volgende gehele getal.

db.createObjectStore('logs', {
  keyPath: 'id',
  autoIncrement: true
});
// id is assigned automatically on add().

Controleren op bestaande objectopslagen

Omdat onupgradeneeded bij elke verhoging van de versie wordt uitgevoerd, controleer je met db.objectStoreNames.contains eerst of een objectopslag al bestaat. Zo voorkom je fouten bij het opnieuw uitvoeren.

request.onupgradeneeded = (e) => {
  const db = e.target.result;
  if (!db.objectStoreNames.contains('notes')) {
    db.createObjectStore('notes', { keyPath: 'id' });
  }
};

De db-verwijzing bewaren

Sla het databaseobject uit onsuccess op, zodat latere bewerkingen het kunnen gebruiken. Alle lees- en schrijfbewerkingen verlopen via deze db-instantie.

let db;
request.onsuccess = (e) => {
  db = e.target.result; // reuse for transactions
};

Geblokkeerde openingen afhandelen

Als een ander tabblad een oudere versie geopend houdt, kan een upgrade blocked zijn. Luister naar onblocked en vraag de gebruiker andere tabbladen te sluiten.

request.onblocked = () => {
  console.log('Close other tabs to upgrade the database.');
};

Het verloop van het openen

IndexedDB openen: roep open aan met een naam en versie, maak je schema aan in onupgradeneeded en haal daarna de db op in onsuccess. Vanaf dat moment voer je transacties uit om gegevens te lezen en te schrijven.

Korte toets

Toets je begrip van het openen van een database.

Samenvatting

Je hebt geleerd hoe je een IndexedDB-database opent:

  • indexedDB.open(name, version) retourneert een verzoek.
  • Maak objectopslagen alleen aan in onupgradeneeded.
  • keyPath stelt de primaire sleutel in; autoIncrement genereert sleutels.
  • Sla de db uit onsuccess op voor later gebruik.
  • Verwerk onerror en onblocked.

Hierna behandelen we transacties en CRUD-bewerkingen.

Gratis beginnen

Leer JavaScript met een AI-tutor — gratis

Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.

Cursussen
59
Lessen
200

Veelgestelde vragen

Is de les “Een database openen” gratis?

Ja — je kunt hier op het web alle 3 lessen van het leerpad JavaScript Academy, waaronder “Een database openen”, gratis volledig lezen. Daarna ontgrendelt CoddyKit PRO alle lessen, plus interactieve oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. De cursus JavaScript Academy bevat in totaal 4 lessen.

Wat leer ik in “Een database openen”?

Maak databases en object stores. Je oefent met JavaScript Academy door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.

Heb ik ervaring nodig om met JavaScript Academy te beginnen?

Ervaring vooraf is niet nodig. JavaScript Academy op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 1 van 4.

Hoe lang duurt de les “Een database openen”?

De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.

Kan ik code schrijven en uitvoeren in deze les over JavaScript Academy?

Ja. Elke les over JavaScript Academy bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.

Alle lessen in deze cursus

  1. Een database openen
  2. Transacties en CRUD
  3. Indexen en queries
  4. Versiebeheer en upgrades
← Terug naar JavaScript Academy