{"__v":1,"_id":"54344d89bfaa3d0800c4d7ff","initVersion":null,"project":"54344d89bfaa3d0800c4d7fa","tags":[],"user":{"_id":"54344d6cbfaa3d0800c4d7f7","username":"","name":"Jason Dobry"},"createdAt":"2014-10-07T20:31:05.444Z","changelog":[{"_id":"5591ae2a342e980d006db03d","update":"","type":"added"}],"body":"Inspired by [Ember Data](https://github.com/emberjs/data), [__JSData__](http://www.js-data.io) is a framework-agnostic, storage-agnostic, in-memory data store. \n\n[JSData's adapters](http://www.js-data.io/docs/working-with-adapters) handle communication with various storage layers, such as `localStorage`, Firebase, RethinkDB, or your RESTful backend.\n\nIn a typical scenario, you load data into the store, which maintains a single representation of every unique record coming from your storage layer. The data store offers an API for read, update, and delete operations, which are executed in your storage layer by an adapter, with the results finally synced back to the store. This is your _Data_ or _Model layer_.\n\nThe Model layer is typically where your business logic resides–where you manipulate your data. There are many variations on this pattern, and JSData can work with your preferences.\n\nJSData runs in the browser, communicating with storage layers such as `localStorage`, Firebase, your RESTful backend (HTTP target), etc. \n\nJSData also runs in NodeJS, where adapters for MongoDB, Redis, RethinkDB, MySql/Postgres/SQLite, etc. are available.\n\nJSData presents a uniform API for executing your typical [CRUD](https://en.wikipedia.org/wiki/Create,_read,_update_and_delete) operations against any storage layer for which an adapter is available. You can easily combine adapters for more complicated data management.\n\nIt is easy to add JSData to your project. Let's get started:\n\n#### Install\n```\n<npm|bower> install --save js-data\n```\n\nJSData is available on [cdnjs](https://cdnjs.com/libraries/js-data) and [jsDelivr](http://www.jsdelivr.com/#!js-data).\n\nYou can add JSData to your app as a script tag, via `import JSData from 'js-data'`, `require('js-data')`, `define(['js-data'], ...)`, etc.\n\n#### Create a store\n[block:embed]\n{\n  \"html\": false,\n  \"url\": \"http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/store.js\",\n  \"title\": null,\n  \"favicon\": null,\n  \"iframe\": true\n}\n[/block]\nThe `DS` constructor function takes an optional `options` object which can be used to override the default settings for your new store. You can also create a store via `JSData.createStore([options])`.\n\n#### Connect to storage\n\nWe're not actually working with any storage layers yet, so let's register an adapter.\n\n```\n<npm|bower> install --save js-data-firebase\n```\n\njs-data-firebase is available on [cdnjs](https://cdnjs.com/libraries/js-data-firebase) and [jsDelivr](http://www.jsdelivr.com/#!js-data-firebase).\n\nYou can add js-data-firebase to your app as a script tag, via `import DSFirebaseAdapter from 'js-data-firebase'`, `require('js-data-firebase')`, `define(['js-data', 'js-data-firebase'], ...)`, etc.\n[block:embed]\n{\n  \"html\": false,\n  \"url\": \"http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/register-firebase.js\",\n  \"title\": null,\n  \"favicon\": null,\n  \"iframe\": true\n}\n[/block]\n#### Model your data\n\nYou start modeling your data by registering Resources with the store:\n[block:embed]\n{\n  \"html\": false,\n  \"url\": \"http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/User.js\",\n  \"title\": \"Plunker - Introduction\",\n  \"favicon\": \"http://embed.plnkr.co/favicon.ico\",\n  \"iframe\": true\n}\n[/block]\nA [JSData Resource](http://www.js-data.io/docs/resources) defines metadata that the store uses to interact with data of that type. The Resource object returned by `DS#defineResource(options)` exposes an API for working directly with data of that Resource.\n\nWith a few lines of code, we can already do all kinds of things with data of type `User`.\n[block:embed]\n{\n  \"html\": false,\n  \"url\": \"http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/inject-user.js\",\n  \"title\": \"Plunker - Introduction\",\n  \"favicon\": \"http://embed.plnkr.co/favicon.ico\",\n  \"iframe\": true\n}\n[/block]\n#### Create a user in Firebase\n[block:embed]\n{\n  \"html\": false,\n  \"url\": \"http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/create.js\",\n  \"title\": \"Plunker - Introduction\",\n  \"favicon\": \"http://embed.plnkr.co/favicon.ico\",\n  \"iframe\": true\n}\n[/block]\n#### Update the user\n[block:embed]\n{\n  \"html\": false,\n  \"url\": \"http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/update.js\",\n  \"title\": \"Plunker - Introduction\",\n  \"favicon\": \"http://embed.plnkr.co/favicon.ico\",\n  \"iframe\": true\n}\n[/block]\n#### Destroy the user\n[block:embed]\n{}\n[/block]\n#### The tip of the iceberg\n\nI hardly had to write an code, and I already have a fully functional CRUD API on top of Firebase! I can easily add more resources, setup relations between them, and even add another adapter for a more complex application.\n\nYou know when you show a treat to a starving (but obedient) puppy, and the puppy just starts drooling all over the floor? That puppy is you right now.\n\nJSData will save you time. It's the Twitter Bootstrap of data layers.\n\nKnock yourself out:\n\n- [JSData on Github](https://github.com/js-data)\n- [Gitter Channel](https://gitter.im/js-data/js-data)\n- [Mailing List](https://groups.io/org/groupsio/jsdata)\n- [JSData website](http://www.js-data.io/)\n- [MtnWestJS 2015 Presentation](https://www.youtube.com/watch?v=8wxnnJA9FKw)\n- [Resources/Models](/docs/resources)\n- [Working with the Data Store](/docs/working-with-the-data-store)\n- [Adapters](/docs/working-with-adapters)\n- [Model Lifecycle](/docs/model-lifecycle)\n- [Custom Instance Behavior](/docs/custom-instance-behavior)\n- [Computed Properties](/docs/computed-properties)\n- [Query Syntax](/docs/query-syntax)\n- [Relations](/docs/relations)\n- [JSData on the Server](/docs/jsdata-on-the-server)","slug":"welcome-to-js-data","title":"Intro to Data Modeling with JSData"}

Intro to Data Modeling with JSData


Inspired by [Ember Data](https://github.com/emberjs/data), [__JSData__](http://www.js-data.io) is a framework-agnostic, storage-agnostic, in-memory data store. [JSData's adapters](http://www.js-data.io/docs/working-with-adapters) handle communication with various storage layers, such as `localStorage`, Firebase, RethinkDB, or your RESTful backend. In a typical scenario, you load data into the store, which maintains a single representation of every unique record coming from your storage layer. The data store offers an API for read, update, and delete operations, which are executed in your storage layer by an adapter, with the results finally synced back to the store. This is your _Data_ or _Model layer_. The Model layer is typically where your business logic resides–where you manipulate your data. There are many variations on this pattern, and JSData can work with your preferences. JSData runs in the browser, communicating with storage layers such as `localStorage`, Firebase, your RESTful backend (HTTP target), etc. JSData also runs in NodeJS, where adapters for MongoDB, Redis, RethinkDB, MySql/Postgres/SQLite, etc. are available. JSData presents a uniform API for executing your typical [CRUD](https://en.wikipedia.org/wiki/Create,_read,_update_and_delete) operations against any storage layer for which an adapter is available. You can easily combine adapters for more complicated data management. It is easy to add JSData to your project. Let's get started: #### Install ``` <npm|bower> install --save js-data ``` JSData is available on [cdnjs](https://cdnjs.com/libraries/js-data) and [jsDelivr](http://www.jsdelivr.com/#!js-data). You can add JSData to your app as a script tag, via `import JSData from 'js-data'`, `require('js-data')`, `define(['js-data'], ...)`, etc. #### Create a store [block:embed] { "html": false, "url": "http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/store.js", "title": null, "favicon": null, "iframe": true } [/block] The `DS` constructor function takes an optional `options` object which can be used to override the default settings for your new store. You can also create a store via `JSData.createStore([options])`. #### Connect to storage We're not actually working with any storage layers yet, so let's register an adapter. ``` <npm|bower> install --save js-data-firebase ``` js-data-firebase is available on [cdnjs](https://cdnjs.com/libraries/js-data-firebase) and [jsDelivr](http://www.jsdelivr.com/#!js-data-firebase). You can add js-data-firebase to your app as a script tag, via `import DSFirebaseAdapter from 'js-data-firebase'`, `require('js-data-firebase')`, `define(['js-data', 'js-data-firebase'], ...)`, etc. [block:embed] { "html": false, "url": "http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/register-firebase.js", "title": null, "favicon": null, "iframe": true } [/block] #### Model your data You start modeling your data by registering Resources with the store: [block:embed] { "html": false, "url": "http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/User.js", "title": "Plunker - Introduction", "favicon": "http://embed.plnkr.co/favicon.ico", "iframe": true } [/block] A [JSData Resource](http://www.js-data.io/docs/resources) defines metadata that the store uses to interact with data of that type. The Resource object returned by `DS#defineResource(options)` exposes an API for working directly with data of that Resource. With a few lines of code, we can already do all kinds of things with data of type `User`. [block:embed] { "html": false, "url": "http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/inject-user.js", "title": "Plunker - Introduction", "favicon": "http://embed.plnkr.co/favicon.ico", "iframe": true } [/block] #### Create a user in Firebase [block:embed] { "html": false, "url": "http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/create.js", "title": "Plunker - Introduction", "favicon": "http://embed.plnkr.co/favicon.ico", "iframe": true } [/block] #### Update the user [block:embed] { "html": false, "url": "http://embed.plnkr.co/H0XBoFdaGI4k6YOf3BW0/update.js", "title": "Plunker - Introduction", "favicon": "http://embed.plnkr.co/favicon.ico", "iframe": true } [/block] #### Destroy the user [block:embed] {} [/block] #### The tip of the iceberg I hardly had to write an code, and I already have a fully functional CRUD API on top of Firebase! I can easily add more resources, setup relations between them, and even add another adapter for a more complex application. You know when you show a treat to a starving (but obedient) puppy, and the puppy just starts drooling all over the floor? That puppy is you right now. JSData will save you time. It's the Twitter Bootstrap of data layers. Knock yourself out: - [JSData on Github](https://github.com/js-data) - [Gitter Channel](https://gitter.im/js-data/js-data) - [Mailing List](https://groups.io/org/groupsio/jsdata) - [JSData website](http://www.js-data.io/) - [MtnWestJS 2015 Presentation](https://www.youtube.com/watch?v=8wxnnJA9FKw) - [Resources/Models](/docs/resources) - [Working with the Data Store](/docs/working-with-the-data-store) - [Adapters](/docs/working-with-adapters) - [Model Lifecycle](/docs/model-lifecycle) - [Custom Instance Behavior](/docs/custom-instance-behavior) - [Computed Properties](/docs/computed-properties) - [Query Syntax](/docs/query-syntax) - [Relations](/docs/relations) - [JSData on the Server](/docs/jsdata-on-the-server)