I'm wondering how to integrate backbone js (http://backbonejs.org/) with persistence js(https://github.com/zefhemel/persistencejs).
the problem is backbone models need to be updated to use the new lib models instead of the restful one.
I tried to use:
backbone.nopersistence: but all data is saved in memory only,
backbone.localStorage: but I need to save data in websql not just localStorage
Try this adapter: https://github.com/MarrLiss/backbone-websql. It's not persistencejs, but it saves to websql at least.
Edit: you can find a better solution here: https://github.com/retrofuturistic/backbone-scaffold. It overrides the default Backbone.js sync API and provides DAO objects to access WebSQL through persistencejs.
After more investigation I found that the best solution is to use persistence models instead of backbone models because backbone models are designed to use restful apis.
Related
I am doing a React app and I want to do my in memory data models with es6 modules and EventEmitter. Wondering if it is recommended to use a singleton.
Also I heard that this event emitter is the one to use.
The answer is yes! Models in a module based front end should be singletons!
Otherwise their data is not persistent across the various imports!
I create a project structure of a web-app with angular.
I create my directories with services, controllers and views.
Then, my team ask me: where are the models? (Nobody of us have worked with angular)
And I answered that in the service, because is where the data persist.
But Im no really sure, and I cant find useful info about this.
What you are looking for is a factory provider. You can create a factory with a collection inside, and this "class" has operations to handle the collection and sincronize it with the back-end.
See this example:
https://github.com/AngularClass/angular-websocket/blob/master/README.md
You can see how to create a collection and initialize it with data that comes from a websocket.
Aditionally you can create operations to handle the collection
This could be consider a "model" in angular.
It is a best practice to keep business logic in Services (and not in controllers, for example). This is, among other reasons, because controllers are instantiated for each view and Services are singeltons.
You can refer to those great posts for more details:
https://johnpapa.net/sharing-data-in-an-angular-controller-or-an-angular-service/
http://teropa.info/blog/2014/10/24/how-ive-improved-my-angular-apps-by-banning-ng-controller.html
https://toddmotto.com/rethinking-angular-js-controllers/
I'm going to assume from the verbiage you've used that you're referring to Angular 1.x.
Services are typically used by controllers to pull data from a provider not displayed in the view. The provider can be a public api, a static file on your own server, a mongo database, etc.
A model for a controller represents the data being manipulated between the view and the controller (refer to ngModel).
I have a quick question on considering AngularJS (current stable version - 1.3.9) for an upcoming application that we are building on an existing framework. The current framework has a Java EE MVC architecture and here are the current components mentioned in sequential order in which they get invoked:
View - JSPs: This layer gets as response Java Objects and we use jsp:useBean to access its properties and display on screen.
If any modifications are done on the page, it goes through a ControllerServlet i.e a Java file which has code to access the HttpRequest and HttpSession related information. The controller also does a lookup in JNDI to find the name of the bean to invoke based on the HttpRequest parameter name, e.g. PageId
Once the EJBBean lookup is returned, the controller invokes an EJB 3.1 "no-interview" view - These are Stateless Beans annotated with #Stateless
EJBBean classes then invoke BusinessObject classes, we call them "BO" which internally gets referenced by the DAO interface
A DAO implementation class is the one which is responsible for CRUD operations
Our Problems as of now:
The view is tightly coupled to Java Objects that are returned from DAOs and since the response is not converted to JSON, a lot of scriptlet code is used to display their value (I know scriplets are oldskool, but being a legacy solution there is no choice)
jQuery is used to manipulate the DOM before sending it to the controller layer
View is not the official record of whats happening on the screen, unlike AngularJS where I could easily understand
Developers write custom CSS for different browsers manually
Proposed Solution
View shall be designed for the new application using AngularJS
Take advantage of Bootstrap css classes which has readily available CSS which can be combined with AngularJS
Each request goes to ControllerServlet using $http service to ensure we use existing MVC architecture i.e routing every request through Controller
EJB Layer to be RESTFul to return data in JSON Format
Viewport specific css code for responsive web design - i.e same screen should render on multiple devices and platforms
Questions:
Is the proposed solution feasible? What are the downsides?
Is it a good practice to reference EJB Bean classes as RESTFul services?
Do we get access to all the Java EE objects / interfaces using AngularJS? For e.g. HttpRequest, HttpSession, etc.
Will it help in performing better by switching to this architecture?
Question from Management - Why not stick with jQuery! - Probably the hardest of all the questions to convince the management of Angular's benefits
Hope you guys can help throw some suggestions
i'm using spring 4.0.1 , hibernate 4.3.5 ,jackson 1.9.2 , I'm creating a RESTful webservice that returns a data in JSON format and angularjs in front-end which is loosely coupled with back-end.
concerning your questions;
the solution is feasible of course , until now there no downsides
except session management is tricky because Restful ws is stateless
.
it's provide a very elegant feature that you can access all your
functionality via any application web-client-side, desktop or
mobile.
angular app is fully isolated from back-end app you can maintain
requests and session in the server and respond with what you like in
json format to angular
same as 2
i hope it's helpful
I don't really understand what a model is in AngularJS. I know what a model is in the context of an MVC framework. For example in PHP I would create a model, like ApiModel.php or something like that, and in there I would put all sorts of cool stuff for the controller to work with.
This doesn't seem to be the way AngularJS thinks of models, in fact I can't find any good explanation of how to implement a model in AngularJS, but everywhere talks about them.
What is a model in AngularJS and how do I use them in the traditional MVC way?
A model in AngularJS specifically communicates with its associated views and controllers and notifies it whether there is a change in its state.
A more thorough description of what is a model can be found in the following link:
https://web.archive.org/web/20140502052028/http://www.webdeveasy.com/angularjs-data-model/
This article is relevant to your inquiry.
More specifically, he mentions that
Model classes encapsulate your application’s data and provide an API to access and manipulate that data. The other classes in your application will make requests of models via this API. When data on the model is updated, the model dispatches events that the other classes within your application can react to. Models are appropriate for capturing the domain logic, such as performing calculations or other manipulations.
A model is just the data that your application consumes.
If the data needs to be dynamic (i.e subject to CRUD operations) you would get this data from a remote source like a database (or even a flat-file) using angularjs' $http in a service or factory and then pass it to the Controller.
If you have a small app for read-only data, then you can hard-code it directly into a Controller.
The most popular data format for angularjs applications these days is JSON because of its flexibility.
The view (or front-end) would then access this data that lives on the scope in the Controller using ng-bind or ng-model or interpolation {{...}}
I'm currently working on a complex single page web app. It's something like a charting program: you can select or add objects on a white page. There's many types of objects. If you select some of type A objects, then it will add/remove B/C/D objects based on a complex logic. I'm currently using Backbone.Model for these objects. And Backbone.View for displaying. It's a pretty standard MVC structure, with models for objects data, controllers for managing models and views, and views for displaying. It's all using DOM elements. The views are added, removed or updated (with CSS) based on model data.
It works great and now I'm trying to add server side to save and load all data to/from the server. I planned to write a REST API server with restify for all the models.
Then I find meteor.js, the 'realtime', 'reactivity' and 'database everywhere' features intrigue me. So it will greatly simplify my app if I can save and load my models directly and let meteor to do the sync. And the real time feature can be a great plus for my future features, such as adding realtime collaboration.
But it seems meteor has a very different idea from Backbone on how a web app is structured. How can I combine meteor with my current Backbone code? Do you have any great suggestions?
Thanks.
Uh, don't. Do meteor all the way, or do backbone, but meteor is pretty much a combined full-stack solution not really intended for use with something like backbone. Meteor already provides deeply-integrated components that address all the areas that backbone addresses (data sync, DOM updates, etc).