-
Notifications
You must be signed in to change notification settings - Fork 4
Data storage
The ccm framework provides a service for component developers for data management. It allows the usage of ccm datastores. A ccm datastore can manage datasets in one of three choosable data levels and can also be used autonomously of ccm components for easy data management. The different data levels are described below. ccm datastores are intended to be universal and provide a simple uniform API for basic CRUD operations to create, read, update and delete datasets.
On the first level the data will be managed in an local object. Than all managed datasets are fugitive data which are gone by leaving the actual opened website.
var component = {
config: {
"store": ["ccm.store", {local: 'dataset.json'}]
},
Instance: function () {
this.start = async () => {
/*
* Gets all data
*/
const data = await this.store.get();
console.log(data);
/*
* Gets Dataset with key "key"
*/
console.log(await this.store.get('key'));
};
}
};dataset.json
[
{
"key": 1,
"value": {
"first_name": "Brok",
"last_name": "Kopje"
}
},
{
"key": 2,
"value": {
"first_name": "Raddie",
"last_name": "Grout"
}
},
{
"key": 3,
"value": {
"first_name": "Filide",
"last_name": "Dalziell"
}
}
]On the second level the data will be managed in a client-side database. Than all managed data is still there after page reload. This is specially interesting for offline functionality.
var component = {
config: {
"store": ["ccm.store", { name: 'data-level-2' }]
},
Instance: function () {
this.start = async () => {
/*
* Set multiple data
*/
await this.store.set({
"key": 1,
"value": {
"first_name": "Brok",
"last_name": "Kopje"
}
});
await this.store.set({
"key": 2,
"value": {
"first_name": "Raddie",
"last_name": "Grout"
}
});
await this.store.set({
"key": 3,
"value": {
"first_name": "Filide",
"last_name": "Dalziell"
}
});
/*
* Get all data
*/
const data = await this.store.get();
/*
* Iterate through all data
*/
data.forEach((element) => {
console.log(element);
});
/*
* Get value of data with key "2"
*/
console.log(await this.store.get(2));
/*
* Update dataset with key "2" and values given
*/
await this.store.set({
"key": 2,
"value": {
"first_name": "Elicia",
"last_name": "Giorgini"
}
});
/*
* Deletes dataset with key "2"
*/
await this.store.del(2);
/*
* Create dataset with auto created key
*/
let autoKey = await this.store.set({
"value": {
"first_name": "Elicia",
"last_name": "Giorgini"
}
});
};
}
};On the third level the data will be managed in any server-side database of choice. The server must have an ccm compatible interface. Than all managed datasets are stored persistently on a server and they are not bound to a specific client. Different network protocols are possible for communication between client and server. In case of realtime communication with Web Socket as network protocol for a ccm datastore with data level 3, the server informs every active client about changing data sets. Then a ccm component which uses such a datastore can react to these changes. That means mostly to update immediately content in the frontend.
var component = {
config: {
"store": [ "ccm.store", { name: 'data-level-3', url: 'http://path/to/server/interface' }]
},
Instance: function () {
this.start = async () => {
/*
* Set multiple data
*/
await this.store.set({
"key": 1,
"value": {
"first_name": "Brok",
"last_name": "Kopje"
}
});
await this.store.set({
"key": 2,
"value": {
"first_name": "Raddie",
"last_name": "Grout"
}
});
await this.store.set({
"key": 3,
"value": {
"first_name": "Filide",
"last_name": "Dalziell"
}
});
/*
* Get all data
*/
const data = await this.store.get();
/*
* Iterate through all data
*/
data.forEach((element) => {
console.log(element);
});
/*
* Get value of data with key "2"
*/
console.log(await this.store.get(2));
/*
* Update dataset with key "2" and values given
*/
await this.store.set({
"key": 2,
"value": {
"first_name": "Elicia",
"last_name": "Giorgini"
}
});
/*
* Deletes dataset with key "2"
*/
await this.store.del(2);
/*
* Create dataset with auto created key
*/
let autoKey = await this.store.set({
"value": {
"first_name": "Elicia",
"last_name": "Giorgini"
}
});
};
}
};