2:05 0 0
IndexedDb with JAVASCRIPT

IndexedDb with JAVASCRIPT

  DrUalcman |  diciembre 312020

Today I want to talk about indexedDb. This API give to us the option to store big data in the browser. But really some times is bit "complicated" to manage, becasue need a lot lines, and know how it's work correctly. Then I would like to create a simple method to manage it.

That's why this post today, I already create a JAVASCRIPT CLASS for can manage indexedDb easy. This is very simple now, but the idea is generate some similar to SQL with instructions like SELECT column1, column2, [...] FROM table WHERE column = value. I hope this script help you. You can get it, and request to colaborate here .

Model Definition

Model definition we must be so send database name, version  and array with tables definition like table name requiered, table options (indicate the keyPath, if it's auto incremental or not, options is not required), table columns, (name, if it's used like a keyPath, if it's autoincremental, and if it's unique), only name must be required.

Here have a example about a Model Definition:

var model = {
    name: 'MyDB', 
    version: 1, 
    tables: [
        {name: 'Usuarios',
         options: {keyPath : 'ssn', autoIncrement: true}, 
         columns: [
                    {name: 'Id', keyPath: true, autoIncrement: false, unique: true }, 
                    {name: 'Email', keyPath: true, autoIncrement: false, unique: true }, 
                    {name: 'Name', autoIncrement: false, unique: false }
                ]
        },
        {name: 'Ministros', 
         options: {keyPath : 'ssn', autoIncrement: true}, 
         columns: [
                    {name: 'Id', keyPath: true, autoIncrement: false, unique: true }, 
                    {name: 'Email', keyPath: true, autoIncrement: false, unique: true }, 
                    {name: 'Name', autoIncrement: false, unique: false }
                ]
        }
    ]
}

Methods

  • Connected(): return database name and version
  • Select(table, callBack): return all array json data into the table
  • SelectId(table, id, callBack): return json data from the table with id send. Id must be the keyPath
  • SelectWhere(table, column, value, callBack): return json data from the table and column with the value send
  • Insert(table, data, callBack): insert data into a table. data always must be contect all the columns from the table definition
  • Update(table, data, callBack): update data into a table. data always must be contect all the columns from the table definition, is don't exist then insert the data into the table
  • Delete(table, id, callBack): delete row from the table with the id send
  • Drop(table, callBack): drop the full table

Return object

In the select methods return the JSON with the data about the table requested. For the methods insert, update, delete and drop the response json opject definition is

{
    result: true/false,
    message: 'action message or error messge'
}

Because still working for now this is a simple amagement. But i will continues working about my idea to send a query like in SQL to get the result. Also I would like implement the JOINS in different tables, and resturn the object with the query result.

How to use

I create 2 JAVASCRIPT files, but you can merge in only one, or you can create your own 2nd file to manage the class. The main file it's jsDB.jsb here is where we going to manage all relative the indexedDB. And is what we needs to insert in the HTML document with a reference.

< script src="jsDB.js">< /script>

Then only need to delcare the class like:

var model = {
    name: 'MyDB', version: 1,
    tables: [{
        name: 'Users', options: { keyPath: 'ssn', autoIncrement: true },
        columns: [{ name: 'Id', keyPath: true, autoIncrement: false, unique: true },
        { name: 'Email', keyPath: true, autoIncrement: false, unique: true },
        { name: 'Name', autoIncrement: false, unique: false }]
    }
    ]
};
var db = new jsDB(model);
That't all, then use the methods like db.Select('Users').

Conclusion

I know you can find already some similar to my idea, but really i feel is bit complicated some times. That's why this project.

Also available in


Happy codding


#javascript

0 Comentarios

 
 
 

Archivo