Skip to content

Instantly share code, notes, and snippets.

@chrisbirster
Created October 10, 2023 19:28
Show Gist options
  • Save chrisbirster/6cbca002069b46a3ef26da7ede214ba8 to your computer and use it in GitHub Desktop.
Save chrisbirster/6cbca002069b46a3ef26da7ede214ba8 to your computer and use it in GitHub Desktop.
Provides an example of CRUD operations using the low-level API with a Users database for IndexedDB
let db;
// Open the database
let openRequest = indexedDB.open('myDatabase', 1);
openRequest.onupgradeneeded = function(e) {
console.log('Upgrading the database...');
db = e.target.result;
if (!db.objectStoreNames.contains('users')) {
console.log('Creating object store...');
db.createObjectStore('users', { keyPath: 'id' });
}
};
openRequest.onsuccess = function(e) {
console.log('Database opened successfully.');
db = e.target.result;
// Add a new user
addUser();
};
openRequest.onerror = function(e) {
console.error('Error opening database:', e.target.errorCode);
};
function addUser() {
let transaction = db.transaction('users', 'readwrite');
let users = transaction.objectStore('users');
let addRequest = users.add({ id: 1, name: 'Jill' });
addRequest.onsuccess = function() {
console.log('User added successfully.');
// Fetch and log the added user
fetchUser();
};
addRequest.onerror = function(e) {
console.error('Error adding user:', e.target.errorCode);
};
}
function fetchUser() {
let transaction = db.transaction('users', 'readonly');
let users = transaction.objectStore('users');
let fetchRequest = users.get(1);
fetchRequest.onsuccess = function() {
console.log('Fetched user:', fetchRequest.result);
// Update the fetched user's name
updateUser();
};
fetchRequest.onerror = function(e) {
console.error('Error fetching user:', e.target.errorCode);
};
}
function updateUser() {
let transaction = db.transaction('users', 'readwrite');
let users = transaction.objectStore('users');
let updatedUser = { id: 1, name: 'Jack' };
let updateRequest = users.put(updatedUser);
updateRequest.onsuccess = function() {
console.log('User updated successfully.');
// Delete the user
deleteUser();
};
updateRequest.onerror = function(e) {
console.error('Error updating user:', e.target.errorCode);
};
}
function deleteUser() {
let transaction = db.transaction('users', 'readwrite');
let users = transaction.objectStore('users');
let deleteRequest = users.delete(1);
deleteRequest.onsuccess = function() {
console.log('User deleted successfully.');
};
deleteRequest.onerror = function(e) {
console.error('Error deleting user:', e.target.errorCode);
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment