Top 15 JavaScript frameworks you could use today

I love JavaScript and the complexity of what you can do to make your website more interactive and dynamic. Ajax was a big turning point for me which help make most of my php code work smoothly without loading the browser page. I was ecstatic when I first realized the power of javascript working together with a server side language like PHP.

jQuery

So as I would like to start off with the first JavaScript framework and probably the most popular one. jQuery is probably the most easy framework to start using. My favorite content management system WordPress is using jquery to make things in the admin more dynamic.

Knockout

“Knockout is a JavaScript library that helps you to create rich, responsive display and editor user interfaces with a clean underlying data model. Any time you have sections of UI that update dynamically (e.g., changing depending on the user’s actions or when an external data source changes), KO can help you implement it more simply and maintainably.”

Tutorials for Knockout:

http://blog.stevensanderson.com/2010/07/05/introducing-knockout-a-ui-library-for-javascript/

http://thinkvitamin.com/code/javascript/build-dynamic-pages-with-knockout-js/

ExtJS

“Ext JS 4 brings a whole new way to build client applications, by introducing the popular model-view-controller pattern to Ext JS. By allowing the separation of data management, logic and interface elements, Ext JS 4 makes it easier for even large development teams to work independently without worrying about stepping on each other’s toes. Ext JS 4 ships with a helpful MVC guide to get started.”

Tutorial for ExtJS:

http://mapfish.org/doc/tutorials/extjs.html

Angular

“Angular supports the entire development process, provides structure for your web apps, and works with the best JS libraries. With angular, the view and data model are always in sync — there is no need for manual DOM manipulation.

Angular is small, weighing in at 60kb, is compatible with all modern browsers and works great with jQuery.”

Tutorials for Angular.js

http://docs.angularjs.org/#!/misc/started

http://jacobmumm.com/2011/08/25/angular-js-nested-repeatable-example/

Agility

“Agility.js is an MVC library for Javascript that lets you write maintainable and reusable browser code without the verbose or infrastructural overhead found in other MVC libraries. The goal is to enable developers to write web apps at least as quickly as with jQuery, while simplifying long-term maintainability through MVC objects.”

Tutorials for Agility:

http://agilityjs.com/docs.html

Choco

“Choco brings the MVC to the client side! A Choco app consists of only one HTML page, all the interactions are managed by Javascript. Your UI only uses HTML and CSS!”

Tutorials for Choco:

I couldn’t find any, if you know of some please let me know in the comment section.

Sammy 

“Sammy.js is a tiny JavaScript framework developed to ease the pain and provide a basic structure for developing JavaScript applications. Sammy tries to achieve this by providing a small ‘core’ framework and an ever-growing list of plugins for specific functionality.”

Tutorials for Sammy:

http://sammyjs.org/docs/tutorials/json_store_1

http://net.tutsplus.com/tutorials/javascript-ajax/quick-tip-an-introduction-to-sammy-js/

Eyeballs 

“eyeballs.js is a slim javascript library designed to sit on top of a javascript framework, such as jQuery or Prototype. eyeballs.js can sit on top of an already implemented web app with a well thought out object model. It can also be used to build standalone javascript apps, backed by HTML5 local storage or something like CouchDB.”

Tutorials for Eyeballs:

Nothing found

ActiveJS

“ActiveJS is a JavaScript application framework that provides local and REST based data modeling and pure DOM view construction with back button and history support along with framework agnosticm and lack of external dependencies.”

Tutorials for ActiveJS:

http://activejs.org/samples/simple_view.html

 

Spine

“Spine is a lightweight framework for building JavaScript web applications. Spine gives you a MVC structure and then gets out of your way, allowing you to concentrate on the fun stuff, building awesome web applications.”

Tutorials for Spine:

http://addyosmani.com/blog/building-apps-spinejs/

http://kazimanzurrashid.com/posts/meet-spine-dot-js-my-framework-of-choice-for-client-side-mvc-part-1

qooxdoo

“qooxdoo is a universal JavaScript framework that enables you to create applications for a wide range of platforms. With its object-oriented programming model you build rich, interactive applications (RIAs), native-like apps for mobile devices, light-weight traditional web applications or even applications to run outside the browser.”

Tutorials for qooxdoo:

http://greg.chiaraquartet.net/working-with-qooxdoo-and-php

http://www.htmlgoodies.com/beyond/javascript/a-developer-looks-at-the-qooxdoo-1.4-javascript-framework.html

Backbone.js

“Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.”

Tutorials for Backbone.js:

http://net.tutsplus.com/tutorials/javascript-ajax/getting-started-with-backbone-js/

http://devblog.supportbee.com/2011/07/29/backbone-js-tips-lessons-from-the-trenches/

 

Asana Luna

“Luna is one of those hush-hush private frameworks that people have been talking about. And for good reason, I must admit.

The framework features a lot of niceties including an evolved MVC architecture, pubsub, caching, routing and authentication”

Tutorials for Asana Luna:

Nothing found L

JavaScriptMVC

“Built on jQuery, JavaScriptMVC is a veteran in the front end frameworks battlefield, dating back to 2008. Featuring a familiar, and obvious, MVC architecture, this framework is quite full featured with support for code generators, testing and dependency management.”

Tutorials for JavaScriptMVC:

http://javascriptmvc.com/docs.html

https://gist.github.com/989117

Cappuccino

“Cappuccino was created by the 280North team, now owned by Motorola. This framework gained significant coverage with the release of the 280Slides — built completely with Cappuccino.

This framework varies dramatically from the others in that a developers doesn’t need to understand or work with any of the front end trifecta — HTML, CSS or the DOM. All you need to master is the framework!”

Tutorials for Cappuccino:

http://www.nice-panorama.com/Programmation/cappuccino/

http://cappuccino.org/learn/tutorials/objective-j-tutorial.php

Sproutcore

“Sproutcore powers a lot of high profile apps including MobileMe amongst others. Sproutcore has a steeper learning curve compared to the other options but makes up for it with developer productivity once he/she has learned the ropes.

This framework boasts a UI framework, the market standard MVC architecture and well written documentation.”

Tutorials for Sproutcore:

http://yehudakatz.com/2011/06/11/using-sproutcore-2-0-with-jquery-ui/

http://net.tutsplus.com/tutorials/javascript-ajax/how-to-build-a-micro-blog-with-sproutcore-new-on-premium/

That’s it we’re done!

You should have a look at all of the above javascript frameworks to see what they can do. Each of them has their own uniqueness and could enrich your web applications. Hope you enjoyed the list.

Related Posts:

  • No Related Posts
  • rss
  • email
  • rss
  • email
I'm a full time PHP developer and I just love all things web related. If you need help I'm your guy.

3 Responses to Top 15 JavaScript frameworks you could use today

  1. Paul Lazarev says:

    Nice collection. Here is an addition to your list: http://www.dhtmlx.com/docs/products/dhtmlxSuite/index.shtml
    DHTMX is a mature and rich JavaScript UI library for building cross-browser web apps.

  2. qwewqeqeq says:

    oh my cat

  3. An0nym0usC0ward says:

    IMO qooxdoo rocks. And has been doing this for several years now.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>