Web Development IndexedDB এর মাধ্যমে Data Storage গাইড ও নোট

217

IndexedDB কি?

IndexedDB হল একটি ব্রাউজার-বেসড ডেটাবেস সিস্টেম যা ওয়েব অ্যাপ্লিকেশনগুলির জন্য ক্লায়েন্ট সাইডে ডেটা স্টোর করতে ব্যবহৃত হয়। এটি ওয়েব অ্যাপ্লিকেশনের জন্য বড় আকারের ডেটা স্টোরেজ সক্ষম করে, যেমন সিস্টেমের ফাইল এবং বিভিন্ন ধরনের ডেটা যার জন্য সাধারণত সার্ভার যোগাযোগের প্রয়োজন হয় না। IndexedDB ব্যবহার করে আপনি transactional ডেটা পরিচালনা করতে পারেন যা অ্যাসিঙ্ক্রোনাস ভাবে কাজ করে এবং বড় ডেটাসেট ব্যবস্থাপনায় সহায়ক।

Sencha Touch একটি জনপ্রিয় HTML5 ফ্রেমওয়ার্ক যা মোবাইল অ্যাপ্লিকেশন তৈরি করতে ব্যবহৃত হয়। IndexedDB এর মাধ্যমে ডেটা স্টোরেজ ব্যবহার করে আপনি Sencha Touch অ্যাপ্লিকেশনে অফলাইন ডেটা ম্যানেজমেন্ট এবং স্টোরেজের সুবিধা যোগ করতে পারেন। এটি মূলত client-side storage হিসেবে কাজ করে।


IndexedDB এর সুবিধা

  1. অফলাইন সাপোর্ট: IndexedDB ওয়েব অ্যাপ্লিকেশনগুলির জন্য অফলাইন সাপোর্ট প্রদান করে, যেখানে ব্যবহারকারীরা ইন্টারনেট কানেকশন ছাড়া ডেটা অ্যাক্সেস এবং আপডেট করতে পারে।
  2. বড় ডেটা স্টোরেজ: এটি অনেক বড় আকারের ডেটা সংরক্ষণ করতে পারে, যা ওয়েব স্টোরেজ (localStorage/sessionStorage) বা কুকি থেকে অনেক বেশি।
  3. এসিঙ্ক্রোনাস অপারেশন: IndexedDB একটি অ্যাসিঙ্ক্রোনাস API সরবরাহ করে, যাতে ডেটা অপারেশনগুলি ব্লক না হয় এবং ইউজার ইন্টারফেসে কোনও বিলম্ব না আসে।
  4. কুয়েরি সাপোর্ট: IndexedDB জটিল কুয়েরি সাপোর্ট করে এবং এটি অ্যাপ্লিকেশন ডেটার জন্য একটি ইনডেক্স তৈরি করে দ্রুত ডেটা অনুসন্ধান এবং অ্যাক্সেস প্রদান করে।

Sencha Touch এবং IndexedDB ব্যবহার

Sencha Touch ফ্রেমওয়ার্কে IndexedDB ব্যবহার করে আপনি মোবাইল অ্যাপ্লিকেশন ডেটা ক্লায়েন্ট সাইডে স্টোর করতে পারেন। নিচে Sencha Touch এর মাধ্যমে IndexedDB ব্যবহার করে ডেটা স্টোর এবং রিট্রিভ করার কিছু সাধারণ উদাহরণ দেওয়া হলো।


১. IndexedDB Setup in Sencha Touch

Sencha Touch এ IndexedDB ব্যবহার করতে আপনি JavaScript এর মাধ্যমে IndexedDB API-কে অ্যাক্সেস করবেন। নিচে একটি সাধারণ IndexedDB ডাটাবেস তৈরি করার উদাহরণ দেওয়া হল:

// Creating a new IndexedDB database
var request = indexedDB.open("myDatabase", 1);

request.onupgradeneeded = function(event) {
  var db = event.target.result;

  // Creating an object store
  var store = db.createObjectStore("users", { keyPath: "id" });

  // Creating indexes
  store.createIndex("name", "name", { unique: false });
};

request.onsuccess = function(event) {
  console.log("Database opened successfully");
};

request.onerror = function(event) {
  console.error("Error opening database", event);
};

এখানে, একটি নতুন IndexedDB ডাটাবেস তৈরি করা হচ্ছে যার নাম "myDatabase" এবং এর মধ্যে একটি users নামে অবজেক্ট স্টোর তৈরি করা হচ্ছে।


২. IndexedDB-এ ডেটা ইনসার্ট করা

IndexedDB-তে ডেটা ইনসার্ট করতে আমরা put() মেথড ব্যবহার করি। এখানে একটি উদাহরণ দেওয়া হলো যেখানে একটি ইউজারের ডেটা ইনসার্ট করা হচ্ছে:

var request = indexedDB.open("myDatabase", 1);

request.onsuccess = function(event) {
  var db = event.target.result;

  var transaction = db.transaction(["users"], "readwrite");
  var store = transaction.objectStore("users");

  var user = {
    id: 1,
    name: "John Doe",
    email: "john@example.com"
  };

  var request = store.put(user);

  request.onsuccess = function() {
    console.log("User data inserted successfully");
  };

  request.onerror = function(event) {
    console.error("Error inserting data", event);
  };
};

এখানে, put() মেথড ব্যবহার করে user অবজেক্টটি users অবজেক্ট স্টোরে ইনসার্ট করা হচ্ছে। এটি একই সাথে ডেটা আপডেট করতে ব্যবহৃত হয়, যদি id ইতিমধ্যেই উপস্থিত থাকে।


৩. IndexedDB থেকে ডেটা রিট্রিভ করা

IndexedDB থেকে ডেটা রিট্রিভ করতে get() বা getAll() মেথড ব্যবহার করা হয়। নিচে একটি উদাহরণ দেওয়া হলো যেখানে একটি ইউজারের ডেটা id অনুসারে রিট্রিভ করা হচ্ছে:

var request = indexedDB.open("myDatabase", 1);

request.onsuccess = function(event) {
  var db = event.target.result;

  var transaction = db.transaction(["users"], "readonly");
  var store = transaction.objectStore("users");

  var getRequest = store.get(1); // Getting user with id 1

  getRequest.onsuccess = function() {
    console.log("User data retrieved:", getRequest.result);
  };

  getRequest.onerror = function(event) {
    console.error("Error retrieving data", event);
  };
};

এখানে, get(1) মেথড ব্যবহার করে id = 1 ইউজারের ডেটা রিট্রিভ করা হচ্ছে।


৪. IndexedDB-তে ডেটা আপডেট এবং ডিলিট করা

IndexedDB তে ডেটা আপডেট করার জন্য put() মেথড আবার ব্যবহার করা যায় এবং ডেটা মুছে ফেলার জন্য delete() মেথড ব্যবহার করা হয়।

ডেটা আপডেট:

var request = indexedDB.open("myDatabase", 1);

request.onsuccess = function(event) {
  var db = event.target.result;

  var transaction = db.transaction(["users"], "readwrite");
  var store = transaction.objectStore("users");

  var user = {
    id: 1,
    name: "John Doe Updated",
    email: "john.updated@example.com"
  };

  var updateRequest = store.put(user);

  updateRequest.onsuccess = function() {
    console.log("User data updated successfully");
  };
};

ডেটা ডিলিট:

var request = indexedDB.open("myDatabase", 1);

request.onsuccess = function(event) {
  var db = event.target.result;

  var transaction = db.transaction(["users"], "readwrite");
  var store = transaction.objectStore("users");

  var deleteRequest = store.delete(1); // Delete user with id 1

  deleteRequest.onsuccess = function() {
    console.log("User deleted successfully");
  };
};

৫. IndexedDB এবং Sencha Touch এর ইন্টিগ্রেশন

Sencha Touch অ্যাপ্লিকেশনে IndexedDB ইন্টিগ্রেট করার মাধ্যমে আপনি অফলাইন ডেটা স্টোরেজ ব্যবস্থাপনা করতে পারবেন। উদাহরণস্বরূপ, আপনি Sencha Touch Model ব্যবহার করে ডেটা ফেচ এবং স্টোর করতে পারেন।

Sencha Touch Model এবং IndexedDB ব্যবহার:

Ext.define('User', {
  extend: 'Ext.data.Model',
  fields: ['id', 'name', 'email'],

  proxy: {
    type: 'localstorage', // LocalStorage proxy or IndexedDB proxy can be used
    id: 'user-data'
  }
});

var user = Ext.create('User', {
  id: 1,
  name: 'John Doe',
  email: 'john@example.com'
});

// Save the user data to IndexedDB
user.save();

এখানে, Sencha Touch Model এর মাধ্যমে IndexedDB তে ডেটা সেভ করা হচ্ছে। proxy ব্যবহার করে আপনি localstorage বা IndexedDB ব্যবহার করতে পারেন।


সারাংশ

IndexedDB হল একটি শক্তিশালী ক্লায়েন্ট-সাইড স্টোরেজ ব্যবস্থা যা অফলাইন ডেটা স্টোর এবং ম্যানেজমেন্টের জন্য ব্যবহার করা যায়। Sencha Touch ফ্রেমওয়ার্কে IndexedDB ব্যবহার করে আপনি ওয়েব অ্যাপ্লিকেশনগুলিতে অফলাইন ডেটা সেভ এবং অ্যাক্সেস করতে পারেন, যা ইউজারদের ডেটা অ্যাক্সেসের সুবিধা দেয়, বিশেষ করে যখন ইন্টারনেট কানেকশন নেই।

Content added By
Promotion

Are you sure to start over?

Loading...