• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Geekup Leeds - Why the YUI?
 

Geekup Leeds - Why the YUI?

on

  • 14,706 views

My presentation at GeekUp in Leeds, UK about the ins and outs why libraries in general and the YUI is a good idea.

My presentation at GeekUp in Leeds, UK about the ins and outs why libraries in general and the YUI is a good idea.

Statistics

Views

Total Views
14,706
Views on SlideShare
14,075
Embed Views
631

Actions

Likes
9
Downloads
115
Comments
0

16 Embeds 631

http://www.wait-till-i.com 220
http://developer.yahoo.com 164
http://developer.yahoo.net 121
http://christianheilmann.com 85
http://docupia.tistory.com 15
http://icant.co.uk 9
http://all-for-women.com 4
http://localhost 3
http://www.slideshare.net 2
http://www.wretch.cc 2
http://geneticnanobot.com 1
http://nanotechnologyproducts.org 1
http://retinalprojectors.com 1
http://webcache.googleusercontent.com 1
file:// 1
http://nanotechrobotics.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

CC Attribution-ShareAlike LicenseCC Attribution-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Geekup Leeds - Why the YUI? Geekup Leeds - Why the YUI? Presentation Transcript

    • Y the YUI?
      • Christian Heilmann,
      • GeekUp Leeds, February 2008
    • Why any library?
    • Because not everybody likes pain.
    • Browsers have shifty eyes and will steal your lunch money!
    • Memory leaks, creative standards support and syntax oddities make your life less fun
    • So why the YUI?
    • First of all, please stop the fanboy fights.
    • All good libraries want to do the same thing: make your life easier.
    • YUI has one big benefit though:
    • It is Dr.Martens for the web: Industrial strength for your solutions.
    • Safety and Maintainability.
    • Namespacing included.
    • Let’s guess what the following things are...
    • YAHOO.util.Dom YAHOO.util.Event YAHOO.widget.ColorPicker
    • Roll your own: YAHOO.namespace(‘GeekUp’); YAHOO.GeekUp.getRoundIn = function(){...}
    • Mess around with JavaScript: YAHOO.lang. ...
    • OO-goodness for JS, Testing for types: isArray, isBoolean, isFunction, isNull, isNumber isObject, isString, isUndefined, isValue
    • React to User Agents: YAHOO.env.ua if(YAHOO.env.ua.ie === 5){ alert(“you hate developers,right?”); }
    • OMG! It is so HUGE!
    • Hosting by YAHOO (CDN, gzipped, minified)
    • Include on-demand, either with YAHOO loader, get or YAHOO_config.
    • Take control with Custom Events.
    • You do know what happens when and how and you can react to it.
    • Yes, you can use CSS selectors! (as a query and as a filter)
    • You have full API documentation, examples and cheatsheets - even offline! (Elephants, Tigers and Bears are extra.)
    • Oh, and the YUI is *not* a JavaScript library!
    • It is a framework of JS, CSS, Design Patterns and Widgets.
    • Developed and tested for use in Yahoo! properties, and handed over to you for free! (BSD license FTW)
    • Go, fetch! http://developer.yahoo.com/yui
    • Tips for quick YUI development:
    • Get an IDE that supports it (Aptana, Eclipse, TextMate Bundle)
    • Make your own shortcuts and nest them in a module pattern.
    • YAHOO.namespace('geekup'); YAHOO.geekup.doStuff = function(){ function handler(){ if(YAHOO.util.Dom.hasClass(this, 'hl')){ YAHOO.util.Dom.removeClass(this, 'hl'); } else { YAHOO.util.Dom.addClass(this, 'hl'); } } var nav = YAHOO.util.Dom.get('nav'); var lis = YAHOO.util.Selector.query('#nav li') for(var i=0;lis[i];i++){ YAHOO.util.Event.addListener(lis[i], 'click', handler); } }();
    • YAHOO.namespace('geekup'); YAHOO.geekup.doStuff = function(){ var YD = YAHOO.util.Dom, var YE = YAHOO.util.Event; var $ = YAHOO.util.Selector.query; function handler(){ if(YD.hasClass(this, 'hl')){ YD.removeClass(this, 'hl'); } else { YD.addClass(this, 'hl'); } } var lis = $('#nav li') for(var i=0;lis[i];i++){ YE.on(lis[i], 'click', handler); } }();
    • YAHOO.namespace('geekup'); YAHOO.geekup.doStuff = function(){ var YD = YAHOO.util.Dom, var YE = YAHOO.util.Event; var $ = YAHOO.util.Selector.query; function handler(){ if(YD.hasClass(this, 'hl')){ YD.removeClass(this, 'hl'); } else { YD.addClass(this, 'hl'); } } var lis = $('#nav li') for(var i=0;lis[i];i++){ YE.on(lis[i], 'click', handler); } }();
    • YAHOO.namespace('geekup'); YAHOO.geekup.doStuff = function(){ var YD = YAHOO.util.Dom; var YE = YAHOO.util.Event; var $ = YAHOO.util.Selector.query; YE.on($('#nav li'),'click',function(){ if(YD.hasClass(this, 'hl')){ YD.removeClass(this, 'hl'); } else { YD.addClass(this, 'hl'); } }); }();
    • YAHOO.namespace('geekup'); YAHOO.geekup.doStuff = function(){ var YD = YAHOO.util.Dom; var YE = YAHOO.util.Event; var $ = YAHOO.util.Selector.query; YE.on($('#nav li'),'click',function(){ if(YD.hasClass(this, 'hl')){ YD.removeClass(this, 'hl'); } else { YD.addClass(this, 'hl'); } }); }();
    • YAHOO.namespace('geekup'); YAHOO.geekup.doStuff = function(){ var YD = YAHOO.util.Dom; var YE = YAHOO.util.Event; YE.on(YD.get('nav'),'click',function(e){ var t = YE.getTarget(e); if(t.nodeName.toLowerCase()==='li'){ if(YD.hasClass(t, 'hl')){ YD.removeClass(t, 'hl'); } else { YD.addClass(t, 'hl'); } } }); }();
    • Thanks, now tell me what you’d like to know.