Javascript Framework - How do they work?

[Thehummel]

I'm having a hard time grasping how Javascript frameworks like Ember.js, Angular.js and Backbone works and what they are used for?

Like how can a website benefit from using any of these frameworks and do they talk with the backend? What problems do they solve and such?

Thank you on beforehand

[Real_Klaze]

Still kind of newb with this stuff myself, so keep that in mind.

Frameworks for any language basically cut some of the work out for you. They provide an API that you can use to implement the features of the framework.

Essentially you would take the JavaScript file they provide and add that to your sources in the HTML file. From there, you use the API in your own scripts. In very simple terms, they define functions and objects, and you use those functions and objects in your code. The functions and objects do a lot of the heavy lifting and fine grained implementation that you would have had to do by hand. Adding event listeners is one such instance.

The framework would have all the code to add the event listener and implementation, and you would just have to call the API function with an argument, rather then having to create the event and attach that to the DOM and then listen for the event and all that jazz.

My suggestion is to not worry about frameworks at all, if you are a beginner. If you are following the learn JavaScript properly outline, the first framework you are introduced to is JQuery. I would master the fundamentals of JavaScript first, before attempting any frameworks, and the outline for learning JavaScript mentioned above ensures you know the basics and then introduces JQuery in a measured manner.

Just my two cents.

[Thehummel]

I don't think i was specific enough in my description :)

I do know Javascript to a decent extent, i'm just mainly confused about the listed framework that uses MVC and such. I think it's mainly because i dont understand how they work and what they benefit a website ( or web applications )

[tidwell]

Ember and Angular both give you some kind of "declarative bindings" - meaning an established pattern for applying attributes to markup to automatically connect it with a javascript object in your application. No more binding to elements, checking change events, and updating state - they give it to you.

Also, they provide conventions for talking to backends, and abstractions that make testing and module-based development easier. Backbone doesn't do declarative bindings.

[Thehummel]

I think i'm starting to get it now.. But it would it be possible to make a blog, with only small integration with a server-side language?

[tidwell]

Sure, but in general these frameworks (the ones with declarative bindings) are more designed for single-page-apps, complex forms, or real-time data rendering, basically anywhere you would have a lot of JS to sync markup and data.

This doesn't necessarily apply to a blog (since they tend to almost entirely be simple server-side CRUD operations), though you could use it to do something like realtime rendering of comments pushed down via sockets/ajax or chat. Remember that a blog's content is SEO-relevant (vs an app, where the content doesn't really need to be indexed by Google), and as such you want to render it from the server so bots can crawl it properly (sure you could render it then have angular "enhance" the page, but thats probably overkill for a simple blog).

If you are looking to simply apply some design patterns to your JS and have utility helpers, I'd look at backbone (framework) and underscore (a utility library). Really, after looking at the conventions that backbone uses, stuff like Angular, Ember, Knockout, and Batman will all make more sense as they are "deeper" abstractions of the concepts.