Nowadays there are a lot of SPA websites used for different purposed. Almost all of them need to access different resources in CRUD format (Create/Read/Update/Delete).
I had to take a look into a project that was using Angular to offer the SPA support. The application is hosted in Azure using Web Sites. Everything was great, except one thing. There were around 100 types of entities that were accessed by the SPA application through API controllers.
For CRUD access, the development team defined a dynamic mechanism that was able to fetch data from the database and expose it using REST services over API controllers. The code was pretty ugly, even though the design was good. Personally I had the feeling that they reinvented the wheel.
On top of this custom implementation, there was another mechanism for caching on client side, based on dictionary. Very simple, but perfect for their needs.
When the project ended, they realized one thing. Everything that was made to support client side caching and CRUD access to entities was already supported in Angular using Breeze.
Breeze is a JavaScript library that is used to access data from client side. This library has the ability to cache entities on the client browser even if the client navigates from one page to another. On top of this, you have the ability to write queries in a fluent way (LINQ style) based on OData protocol (Open Data Protocol) and promises.
Breeze is made around EntityManager object, which caches all the entities and also plays the role of the gateway when entities cannot be found in the cache.
Things that I like:
+The way we can define queries
+You have full control when you save data from the local instance (entityManager) to the backend
+Full integration with Entity Framework and API Controller
Lesson learned: Investigate a problem, look to see what kind of 3rd parties you can use to solve your problem before starting to implement your own custom solution.
I had to take a look into a project that was using Angular to offer the SPA support. The application is hosted in Azure using Web Sites. Everything was great, except one thing. There were around 100 types of entities that were accessed by the SPA application through API controllers.
For CRUD access, the development team defined a dynamic mechanism that was able to fetch data from the database and expose it using REST services over API controllers. The code was pretty ugly, even though the design was good. Personally I had the feeling that they reinvented the wheel.
On top of this custom implementation, there was another mechanism for caching on client side, based on dictionary. Very simple, but perfect for their needs.
When the project ended, they realized one thing. Everything that was made to support client side caching and CRUD access to entities was already supported in Angular using Breeze.
Breeze is a JavaScript library that is used to access data from client side. This library has the ability to cache entities on the client browser even if the client navigates from one page to another. On top of this, you have the ability to write queries in a fluent way (LINQ style) based on OData protocol (Open Data Protocol) and promises.
Breeze is made around EntityManager object, which caches all the entities and also plays the role of the gateway when entities cannot be found in the cache.
Things that I like:
+The way we can define queries
var myFooQuery = breeze.EntityQuery()
.from(‘Users’)
.where(‘Name’,’startWith’,’Ra’)
.orderBy(‘Name’);
var entityManager = new breeze.EntityManager(myFooServiceName);
entityManager.execute(myFooQuery)
.then(..)
.fail(…);
+the API Controller has support for OData (out of the box support to expose the services)+You have full control when you save data from the local instance (entityManager) to the backend
entityManager.saveChanges()
.then(..)
.fail(…)
+Custom validation rules (you can define your validation logic on client side)+Full integration with Entity Framework and API Controller
[BreezeController]
public class UsersController : ApiController {
readonly EFContextProvider<UserDbContext> _contextProvider =
new EFContextProvider<UserDbContext>();
// ~/breeze/users/Metadata
[HttpGet]
public string Metadata() {
return _contextProvider.Metadata();
}
// ~/breeze/users/Users
[HttpGet]
public IQueryable<User> Users() {
return _contextProvider.Context.Users;
}
// ~/breeze/users/SaveChanges
[HttpPost]
public SaveResult SaveChanges(JObject saveBundle) {
return _contextProvider.SaveChanges(saveBundle);
}
}
I invite all of you to take a look at Breeze.JSLesson learned: Investigate a problem, look to see what kind of 3rd parties you can use to solve your problem before starting to implement your own custom solution.
Comments
Post a Comment