This article was peer reviewed by Agbonghama Collins. Thanks to all of SitePoint’s peer reviewers for making SitePoint content the best it can be!
Data volumes are growing rapidly and they are becoming more complex to maintain. Many developers want to avoid the problems and headaches that are caused by data issues during their job.
One of the libraries that makes our job easier is Breeze.js. In this article, we will talk about how we can write better queries with Breeze.js. But firstly, we should know what is Breeze.js and why it was created.
What Is Breeze.js?
Breeze.js is a JavaScript library that helps us manage data in rich client applications. Breeze runs natively in every browser and supports client-side querying, caching and dynamic object graphs.
The best thing about Breeze.js is that it doesn’t mirror the server-side model, but it creates it dynamically. With Breeze, the cached data is on the client side. It doesn’t need to query the server because it can query the cache instead. It saves the cache locally and offline. When it is reconnected, it syncs the changes.
Two of the strongest points of Breeze.js are rich queries and change tracking. Four powerful ways to query are filters, sorting, paging and projections. A query needs help to execute, that’s where Breeze EntityManager comes in. Each entity keeps track of its own changed state. We will discuss this later.
Breeze.js works well with a lot of frameworks including AngularJS, Backbone.js, Knockout, Node.js and many others.
Now let’s look at how to setup the environment and get to coding.
How to Install
[author_more]
Breeze can be downloaded from its repository on GitHub. The most common versions of Breeze are:
- breeze.debug.js — This is the standard client library that I suggest using. It has support for third-party libraries including Backbone and Knockout.
- breeze.min.js — Breeze.min.js is the minified breeze.debug.js, its size is 175 KB compared to size of breeze.debug.js, which is 602 KB.
There are two other ways to get Breeze: through Bower and npm. I prefer using Bower because I am more familiar with it. Open the terminal, then go to the client directory and run these two commands to get Breeze:
bower install breeze-client
bower install breeze-client-labs
In order to include Breeze into a the project, you should include this script tag inside the <body> of your page:
<script src="bower_components/breeze-client/build/breeze.debug.js"></script>
Older browsers that do not support ECMAScript 5 can cause problems for Breeze. A shim library is necessary to enable ES5 syntax on these browsers. For Internet Explorer users, it is recommended to enter this code inside the <head> tag, to avoid compatibility mode issues.
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/>
Breeze also needs some extensions to work normally:
- a data service
- a JavaScript component that performs AJAX requests
- a model library for data binding (such as Knockout)
- a promise library
So as to demonstrate Breeze in action, in the next section I’m going to show you how to get one of Breeze’s sample applications up and running. This will include all of these things out of the box.
Prerequisites for the Sample App
So as to run the sample app, you will need Node.js and MongoDB installed on your machine.
Node.js is free to use, and can be downloaded from the project’s homepage. If you have Bower or npm on your computer, you also have Node installed. If you are having trouble installing Node, then check out our tutorial on npm (which includes a section on this): A Beginner’s Guide to npm
MongoDB can be downloaded from their download page. They have guides on how to install for all major operating systems.
Setting up the Sample App
The first thing to do is grab a copy of the Breeze JavaScript Client sample applications. The easiest way to do this is using Git:
git clone https://github.com/Breeze/breeze.js.samples.git
Within the project, navigate to node/zza-node-mongo folder:
cd breeze.js.samples/node/zza-node-mongo
Here you see three folders: client, database, server. In the database folder unzip zza-mongo-database.zip.
cd database
unzip zza-mongo-database.zip
Continue reading %Write Better Queries with Breeze.js%
Source: SitePoint