IndexedDB est une API de bas niveau permettant de stocker de grandes quantités de données structurées et elle est couramment utilisée dans les applications Web pour le stockage côté client. Voici les étapes de base pour utiliser IndexedDB en HTML5 :

1. Ouvrez une base de données :

 javascript
 let db;
const request = window.indexedDB.open('YourDatabaseName', 1);

request.onerror = function (event) {
  console.log('Database error: ' + event.target.errorCode);
};

request.onsuccess = function (event) {
  db = event.target.result;
  console.log('Database opened successfully');
};

request.onupgradeneeded = function (event) {
  // This is called only if the database version is increased
  const db = event.target.result;
  const objectStore = db.createObjectStore('YourObjectName', { keyPath: 'id', autoIncrement: true });

  // You can define indexes here if needed
  objectStore.createIndex('indexName', 'propertyName', { unique: false });
};

2. Ajouter des données :

 javascript
 const transaction = db.transaction(['YourObjectName'], 'readwrite');
const objectStore = transaction.objectStore('YourObjectName');
const data = { id: 1, name: 'John Doe', age: 25 };

const request = objectStore.add(data);

request.onsuccess = function (event) {
  console.log('Data added successfully');
};

request.onerror = function (event) {
  console.log('Error adding data: ', event.target.error);
};

3. Récupérer des données :

 javascript
 const transaction = db.transaction(['YourObjectName'], 'readonly');
const objectStore = transaction.objectStore('YourObjectName');
const request = objectStore.get(1); // Get data with ID 1

request.onsuccess = function (event) {
  const data = event.target.result;
  if (data) {
    console.log('Retrieved data:', data);
  } else {
    console.log('No data found with the specified ID');
  }
};

request.onerror = function (event) {
  console.log('Error retrieving data: ', event.target.error);
};

4. Mettre à jour les données :

 javascript
 const transaction = db.transaction(['YourObjectName'], 'readwrite');
const objectStore = transaction.objectStore('YourObjectName');
const request = objectStore.put({ id: 1, name: 'Updated Name', age: 30 });

request.onsuccess = function (event) {
  console.log('Data updated successfully');
};

request.onerror = function (event) {
  console.log('Error updating data: ', event.target.error);
};

5. Supprimer les données :

 javascript
 const transaction = db.transaction(['YourObjectName'], 'readwrite');
const objectStore = transaction.objectStore('YourObjectName');
const request = objectStore.delete(1); // Delete data with ID 1

request.onsuccess = function (event) {
  console.log('Data deleted successfully');
};

request.onerror = function (event) {
  console.log('Error deleting data: ', event.target.error);
};

Ces exemples couvrent les opérations CRUD de base dans IndexedDB. En fonction de votre application, vous devrez peut-être gérer des transactions, créer plusieurs magasins d'objets et utiliser des fonctionnalités plus avancées proposées par IndexedDB.