An ES6 module to replace Backbone.sync
with browser localStorage
-based persistence. Models are given GUIDS
and saved into a JSON object. Please see
/dist for ES5 bundles for AMD,
CJS, UMD and global consumption.
For the latest significant changes please see the CHANGELOG.
API documentation can be found in the /docs directory and online here.
Usage
The recommended way to consume typhonjs-core-backbone-localstorage
is via JSPM / SystemJS via an ES6 project.
Please see this JSPM / SystemJS / ES6 demo: backbone-es6-localstorage-todos
In addition there is a desktop version using Electron here: electron-backbone-es6-localstorage-todos
Create your ES6 collections like so using a getter for localStorage
:
const s_LOCAL_STORAGE = new Backbone.LocalStorage("SomeCollection"); // Unique name within your app.
export default class SomeCollection extends Backbone.Collection
{
get localStorage() { return s_LOCAL_STORAGE; }
get model() { return SomeModel; }
// ... everything else is normal.
});
Global usage - Include the global ES6 bundle for Backbone.localStorage after having included Backbone.js:
<script type="text/javascript" src="backbone.js"></script>
<script type="text/javascript" src="typhonjs-core-backbone-localstorage.js"></script>
Create your collections like so:
window.SomeCollection = Backbone.Collection.extend({
localStorage: new Backbone.LocalStorage("SomeCollection"), // Unique name within your app.
// ... everything else is normal.
});
If needed, you can use the default Backbone.sync
(instead of local storage) by passing the origSync
option flag
to any Backbone function that takes optional parameters, for example:
var myModel = new SomeModel();
myModel.fetch({ origSync: true });
myModel.save({ new: "value" }, { origSync: true });
Please see this global ES5 demo: backbone-es6-localstorage-todos-global-es5
RequireJS
Include RequireJS:
<script type="text/javascript" src="lib/require.js"></script>
RequireJS config:
require.config({
paths: {
jquery: "lib/jquery",
underscore: "lib/underscore",
backbone: "lib/backbone",
localstorage: "lib/typhonjs-core-backbone-localstorage"
}
});
Define your collection as a module:
define("SomeCollection", ["localstorage"], function() {
var SomeCollection = Backbone.Collection.extend({
localStorage: new Backbone.LocalStorage("SomeCollection") // Unique name within your app.
});
return SomeCollection;
});
Require your collection:
require(["SomeCollection"], function(SomeCollection) {
// ready to use SomeCollection
});
Please see this RequireJS ES5 demo: backbone-es6-localstorage-todos-requirejs-es5
To suggest a feature or report a bug: https://github.com/typhonjs/typhonjs-core-backbone-localstorage/issues
This code was forked and updated to ES6 from: Backbone.localStorage
Original author: Jerome Gravel-Niquet (many thanks!)
typhonjs-core-backbone-localstorage (c) 2016-present Michael Leahy, TyphonRT Inc.
typhonjs-core-backbone-localstorage may be freely distributed under the MIT license.