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 online here.
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
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-backbone/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 MPL v2.0 license.