I use YII widgets for making my views and rely on CGridView, CLiStData, CHtml classes..
I often see comparison online between client side MV* frameworks like Ember, backbone .. and then I use jquery in YII for adding all interactivity. But, the views are being made from widgets.
So, My question is YII a server side HTML rendering framework ?
Yes. Really, what's the question about?
If you ask if Yii can cooperate with some MVVM (Model-View-View-Model) library, like knockout or backbone then answer is yes and no. As generally Yii generates widgets as static HMTL, somewhat enchanced with jQuery. For trully MVVM widgets, you have to make them by your own. Most common case is CActiveForm, to make form bindable to view model.
Personally I use knockoutjs wih yii and made quick and dirty patched version of CActiveFrom (strictly Im using TbActiveForm from YiiBooster, but thats not important here) to add bindings and it works fine.
Isn't it similar question to Yii and Knockout Together?
Related
I am exploring the MVVM Design Pattern for AngularJS but I'm not able to find any related document for that, Most of the document based on KnockoutJS and Silverlight.
MVVM
Pros:
The only advantage of MVVM that it helps in the loading the view faster in case of two-way binding.
Cons:
We can't make the service call . If we want make call we have to include third party library like jQuery or knockoutJS.
For MVC we have both the advantages here. Which means two way binding is also there not as faster in MVVM and
we can make service calls also without having the third party library. We use controller for both above things in MVC.
The above my points is correct or not? please any one help me.
See this link for examples: https://docs.angularjs.org/tutorial/step_02
You can use Spring RESTful Services (or any services for that matter) for your backend, but since Angularjs runs only in the browser, the MVC pattern is moved from the server to the frontend. I suggest that you make the effort and follow the AngularJS tutorial to gain a better understanding.
I'm a little confused about mvc frameworks for the web...take angular for example. Are the "views" in angular the (tweaked out) html and CSS and the "models" just javascript/json-like objects that contain data like regular Ajax data? It seems to me that this is how it is (maybe not in full detail, but roughly it seems like this is it). Does angular even use CSS? And I don't really understand the controller.
I know javascript to a degree where I am not a total beginner but these frameworks make no sense to me, it's like everyone is speaking Greek or something when I look up tutorials. It would help to know I'm sort of on the right track or whether my thinking is wrong, in a ballpark sense.
Help is highly appreciated. Thank you.
It sounds like you're on the right track. In Angular specifically, yes, the views are written declaratively in HTML and special tags and attributes called directives. Models can be anything; often you'll see examples in Angular that use plain JavaScript objects as the models, but in a more complex app you might have special objects that have methods specific to the application. Controllers are just there to tie the two together—they take the models and make them available to the view via the scope, and events (like ng-click) call methods on the controllers which make changes to the models.
AngularJS implements Model-View-Controller paradigm by connecting your HTML (views) to your JavaScript objects (models) via two-way data binding.
It extends HTML by providing directives that add functionality to your markup and allow you to create powerful dynamic templates. You can also create your own directives, crafting reusable components that fill your needs and abstracting away all the DOM manipulation logic. Like most JavaScript MVC frameworks, it lets you work with any server-side technology as long as it can serve your app through a RESTful web API.
You can find more info here:
http://www.angularjstutorial.com/
http://stephanebegaudeau.tumblr.com/post/48776908163/everything-you-need-to-understand-to-start-with
http://mrbool.com/mvc-in-angularjs/28962
Is it good practice to combine MVVM [angularjs,knockout.js]with MVC [JSF/spring].
Is it good way to control mvvm object/variables/ from inside JSF page.
Lets say I have to update a dropdown list in angularjs model by using jsf controller to fetch list object and update angularjs dropdown model. Is this a clean way or a junk way or is it just a work around.
I have to admit that I don't really know JSF or Knockout. However, I can easily imagine that because both sides want to be in charge of viewed components, a component based framework like JSF or Wicket might have trouble playing together with Angular. A couple things come to mind:
Why do you need the component framework from the server side? Why not use a request-based framework like Spring MVC or struts? They should work fine as they are just taking care of the overall page loading.
You will probably be ok if you decide to use one technology to do one thing. For example, do your page containers with JSF, and everything inside the page with Angular. I think you'll be ok with that. Of course, you are losing a big part of the benefit of JSF.
I'm actually doing this right now. I can't say what the best practice is, but we found that we needed to be able to output dynamic HTML from the server, even if you have an MVVM framework in the front end. Things like internationalization is better handled on the server side, and with purely static HTML from the server you run into a lot of limitations.
The main drawback is complexity. You will have controllers, models and views on the server, combined with controllers, templates and viewmodels on the client. This makes the architecture a bit confusing, especially as you bring new members into the team, so documentation and code structure becomes very important.
Overall, I think it's a valid approach. It hasnt bitten us yet, at least :)
I m still new to client side MVC and at this point exploring my options.
Angular.js, Ember.js both are highly recommended frameworks, backbone.js is a library but most of the implementation user has to do.
Need a opinion from someone who has been working in client side MVC, as to how should one decide which one to go for?
Plus I need the UI to be media responsive, for which twitter Bootstrap looks ideal.
Is it possible to use one of these framework along with Twitter Bootstrap? In which framework is it easier to integrate Bootstrap?
Thanks.
AngularJs and Bootstrap are the two which I would start with.
AngularJS is opinionated, this means it will help you structure your code well. If you just want binding then don't forget knockoutjs. This is in the mvc package by default in VS.
Bootstrap is just html and css markup so should work with everything.
If you start a MVC5 project now in VS2013 you will by standard have bootstrap.
Many people will have different opinions on this so you could wait for an answer for a long time.
I understand your confusion when it comes to selecting the right JavaScript framework. There are many deciding factors that you must evaluate before dedicating your time and money. I noticed that you mentioned a MVC in your questions title. The first thing that you will want to understand is exactly which MV* architecture that you want to have for your app and why. Once you have that nailed down then selecting the framework will be much easier since you will have eliminated a few of the frameworks. The four architectures are MVC, MVVM, MVP and MV*. Another major factor that you will want to look at is the binding mechanism used for the framework. Some frameworks only allow one way bindings while others support 2-way bindings.
To answer your question, based on what you have explained, I would say that Ember is going to be your best bet. Ember will work with Bootstrap
http://ember-addons.github.io/bootstrap-for-ember/dist/
If your still researching the facts then you will really want to check out this helpful link to a page that goes over the pros and cons of the most popular JS frameworks.
Check it out here: http://coding.smashingmagazine.com/2012/07/27/journey-through-the-javascript-mvc-jungle/
I have a nice application written in Silverlight. To allow greater cross browser support, we are considering rewriting with a HTML5 front end.
What would be a reasonable way to move from Silverlight using XAML and C# with MVVM coding patterns into a HTML5 front end.
On the other hand, if this is not a good idea and the MVVM pattern should be abandoned, please explain why.
Knockout is a great javascript library which helps you to write MVVM client side. You create your view models in javascript and bind to them using html templates (with the help of jquery templating). Your view models can use ajax to retrieve data.
It is essentially the same as Silverlight development- you have HTML instead of XAML and javascript instead of C#/VB.Net. You could even use the same web services really...which might be helpful if you plan to offer both interfaces or conversion later on.
Edit
Thought that I'd add that IMHO MVVM should not be abandoned as it really does a great job of separating concerns (I guess when implemented correctly) but a big win surely is that it has the developer thinking about or in the mindset or separating responsibility in an application. I've used Knockout.js for web projects and Caliburn.Micro for Silverlight and have really enjoyed that style of development.
Knockout is MVVM pattern implemented in HTML/Javascript with databinding and all.
http://knockoutjs.com/
If what you want is achievable simply through DOM manipulation, and you're used to and like the MVVM pattern, Knockout should be a good choice.
Yeah, the MVVM pattern for HTML 5 is called MVC. Most easily implementable with MVC3. Provides a layer of abstraction in respect to the JavaScript code, support for ViewModels (aka Views) and separation of concerns between the views, data access, and business logic.
Best of all is that validation and UI event handling is wired for you in a simple manner, allowing you to abstract yourself from the intricacies of JavaScript event handlers for various HTML controls.
However if you strictly want to stick with HTML & JavaScript, I suggest rolling your own JavaScript classes (yes JS is functional language, but you can still make those) that represent your UI layer and handle UI events. Then create your own Ajax library for getting JSON serialized data back and forth from the UI classes to the server back end. Finally create your own business logic classes (also in javascript) to control your UI and DataAccess (ajax) classes. In short.... lots of dirty work.
There is also the experimental Model Driven Views (MDV) library from Google.
Unfortunately, it is only intended as a prototype showcase. Conceptually, it is really cool, but be prepared to do some bug fixing on your own.
http://code.google.com/p/mdv/
There is also JSViews. This one is not as slick as Knockout, but it is faster at updating the DOM. The project is loosely related to jquery as its author was behind the now scrapped query templates.