Js il 2013 breeze.js

Israel JavaScript Conference | 03 – 6325707 | [email protected] | www.js-il.com |

Yaniv ArditiCTO, Dynamics Divisions

E4D Solutions [email protected]

http://blogs.microsoft.co.il/blogs/rdt/

Israel JavaScript Conference

mailto:[email protected]

http://www.js-il.com/




Agenda ? Query data Client side Caching Track changes Resources Q&A




What’s ? JS library aimed to manage data in rich client

applications

Implements the Open Data Protocol (OData) query standard

Ships with adapters for the ASP.NET Web API and for OData




Comm

unication

DAL

UI

BL (MV*)

Offline Storage

Entities

Module Module Module

Server

You are here




Why ? It’s free Simplify data query tasks Manage client side data caching Support batch operations Support all modern browsers on desktop and

mobile devices (ECMAScript 5) Out-of-box support for Knockout, Angular, and

Backbone Well documented Has roadmap




Query Data LINQ style syntax Execute query asynchronously with a Promise Query related entities Flatten entity graphs Query server, cache, or both If a query can be expressed in OData syntax, it can

be expressed in Breeze




Query Data

//define query

var query = breeze.EntityQuery().from("Customers")

.where("CompanyName", "startsWith", "C")

.orderBy("CompanyName");

//execute query

var manager = new breeze.EntityManager(serviceName);

manager.executeQuery(query)

.then(querySucceeded)

.fail(queryFailed);




Query Data Breeze resolves this query into an HTTP GET

request formatted as an OData URIhttp://www.example.com/api/Northwind/Customers?$filter=startswith(CompanyName,'C') eq true&$orderby=CompanyName

EntityManager reshapes the result JSON data into entities and merges them into its cache

The Promise object forwards entities to the caller’s success callback




Query Data




Client Side Caching Cache entities locally on the JavaScript client Query client Cache, Server or both Navigate among entities in cache




Client Side Caching/* Query the server, cache, or both */var query = breeze.EntityQuery("Customers");

// execute query asynchronously on the servermanager.executeQuery(query).then(querySuccess).fail(queryFail);

// execute query synchronously on local cachevar customers = manager.executeQueryLocally(query)

// fetch customer by id from cache (if found) or remotelyvar checkCacheFirst = true;manager.fetchEntityByKey("CompanyName", 42, checkCacheFirst).then(fetchSuccess).fail(fetchFail);




Client Side Caching




Track Changes Breeze Entities are self-tracking – they manage

their own state via entityAspect.entityState Refresh an entity to its current state on the server

or revert changed entities to their original values Get notifications about the entities that enter,

leave, and change in cache




Track Changes Examine entity state via

entityAspect.entityState

Respond to entity property change via entityAspect.propertyChanged event

Respond to change validation errors via entityAspect.validationErrorsChanged event




Track Changes/* Change tracking */// save all changes (if there are any)if (manager.hasChanges()){ manager.saveChanges().then(saveSucceeded).fail(saveFailed);}

// listen for any change to a customercustomer.entityAspect.propertyChanged.subscribe(somethingHappened);

// listen for validation errorscustomer.entityAspect.validationErrorsChanged.subscribe(updateValidationUI);




Track Changes




Resources Breeze central

http://www.breezejs.com

Breeze SDKhttp://www.breezejs.com/sites/all/apidocs/index.html

Trouble Shootinghttp://stackoverflow.com/questions/tagged/breeze



http://www.breezejs.com/

http://www.breezejs.com/

http://www.breezejs.com/sites/all/apidocs/index.html

http://www.breezejs.com/sites/all/apidocs/index.html

http://stackoverflow.com/questions/tagged/breeze

http://stackoverflow.com/questions/tagged/breeze


Thanks

Yaniv ArditiCTO, Dynamics Divisions

E4D Solutions [email protected]







www.js-il.com

18.6.13




Technology

Js il 2013 breeze.js