This course will become read-only in the near future. Tell us at community.p2pu.org if that is a problem.

Frameworks and Repositories


Week 5 - Frameworks and Repositories

Developers who frequently interact with JavaScript have to deal with cross-browser compatibility issues continually and, thus, are forced to implement, or use, a JavaScript library/framework in some form.

[[--There is probably a difference between a framework and a library in that a framework might be expected to facilitate more things than a library which might be expected to facilitate only one or a few things, but for writing this, I decided not to make this distinction very carefully and to use the terms interchangeably.--]]

Frameworks make js much easier for developers popular libraries such as Prototype/Scriptaculous, MooTools, YUI, jQuery, are used widely with each library having its own character; jQuery is by far the most widely used with perhaps 50% of the market, followed by Proto/Scrip with perhaps 15%, then YUI and the rest.

Just because a framework doesn't have a large share doesn't meen you shouldn't consider them, a less well known framework may be just the job for your project and knowing js well will help you choose a framework; it is possible that many people simply choose jQuery for ease of use without really understanding (or perhaps not needing to) how it works.

Some interesting alternative frameworks are qooxdoo, sproutcore, backbone and cappuccino.

http://popcornjs.org/


A library for manipulating open video (ie video that doesn’t need a plugin). You may have noticed http://new.p2pu.org/en/groups/interactive-open-video-with-popcornjs/

mark up videos with metadata at each millisecond of video, such as who is in the frame, where that frame takes place, or a definition of what the frame is talking about. This metadata has rich opportunities for new user experiences on the page, and more relevant and specific search engines results. Imagine a search result linking to 30 seconds into a video on a page. And because the meta-data is stored in the browser, it can be modified.


jQuery
You know what an API is, right?  Well, jQuery is an API of an API.  jQuery covers the DOM.
http://jqfundamentals.com/book/index.html#chapter-3
http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

http://jsconf.eu/2010/speaker/the_jquery_divide_by_rebecca_m.html


Intro Jsfiddle. Calling libraries from an online file.

One big library/framework or many small ones?  Depends on scale, purpose.....
http://mir.aculo.us/2011/04/11/i-for-one-welcome-our-new-micro-framework-overlords/?
http://tomdale.net/2011/04/imagine-a-beowulf-cluster-of-javascript-frameworks/
http://microjs.com/?

http://javascriptlibraries.com/  everylibrary under the sun, maybe..

You will often see two versions of a library, someLibrary.js and someLibraryMinified.js; the second is a compressed version of the first, has a smaller file size so will load quicker, use on your project; usually very hard to read so use the normal library for inspection/debugging.

js loading libraries
http://blog.jcoglan.com/2011/04/16/on-the-role-of-js-packages/
http://www.nczonline.net/blog/2011/02/14/separating-javascript-download-and-execution/

http://html5boilerplate.com/
Boilerplate is not a framework, nor does it prescribe any philosophy of development, it's a base HTML/CSS/JS template for a fast, robust and future-proof site. Cross-browser normalization, performance optimizations, optional features like cross-domain Ajax and Flash. A starter apache .htaccess config file  with caching rules and preps your site to serve HTML5 video, use @font-face.

Includes eg
http://www.modernizr.com/   Modernizr is a small and simple JavaScript library that helps you take advantage of emerging web technologies (CSS3, HTML 5) while still maintaining a fine level of control over older browsers that may not yet support these new technologies.

https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills   So here we're collecting all the shims, fallbacks, and polyfills in order to implant html5 functionality in browsers that don't natively support....

github/cloud9ide... development in the cloud, fork/clone eg boilerplate in Github and clone to cloud9ide for development.

Places to find code
http://snipplr.com/all/language/javascript  http://openjsan.org/ https://github.com/languages/JavaScript/created

Task Discussion