ºÝºÝߣ

ºÝºÝߣShare a Scribd company logo

YUI open for all !

?
?
Subramanyan Murali
Subramanyan Murali

YUI or Yahoo! User Interface Libraries is a rich collection of Javascript and CSS libraries that can help a web developer create rich experiences and highly interactive web sites. The libraries are open source and there is a active community around it. YUI 2 was hugely successful with its large collection of utilities and Widgets. Many Yahoo! sites and non Yahoo! sites use these libraries extensively. YUI 3 is the latest offering from Yahoo! that is a much more extensible and powerful Javascript and CSS library. YUI 3 incorporates all the learnings from the experiences creating YUI 2 libraries and many web standards. Todays talk is an introduction into YUI 3 as an Open Source Project and how a developer can get on to contributing to YUI. The talk will give various pointers and references that will allow some one to start exploring the YUI libraries, more specifically YUI 3.0

1 of 49
YUI 3 Open for all ! Subramanyan Murali Coder, hacker, dreamer
Who am I ? Yahoo! Frontend Engineer for 5 years @rmsguhan http://rmsguhan.com YUI User Speaker Photographer Hacker Traveler
Yahoo! User Interface Libraries version 3.0 or YUI 3
YUI 3 is Yahoo!'s next-generation JavaScript and CSS library
Powers many Yahoo! Properties , any so many other web sites around the world
YUI 2.x was hugely successful
YUI 3 is intended to be more powerful , more feature rich and more Open
2006 YUI project was started 2007 YUI 2.2.0, 2.3.0, 2.4.0 2008 YUI 3.0 pr1 & pr2
2009 YUI 3.0 b1 launched YUI on GitHub YUI 3.0 released YUI 3.0 Gallery
http:// developer .yahoo.com/ yui /
So what is the big fuss ?
YUI 2 JavaScript core, utilities, widgets; CSS foundation including YUI 3 JavaScript core, utilities; CSS foundation; Gallery. YUI Compressor JavaScript core, utilities, widgets; CSS foundation including YUI Doc Build-time tool for generating API documentation YUI PHP Loader Flexible PHP js/css mgt. solution, includes YUI metadata; combos. YUI Builder Build scripts for generating YUI JS/CSS from source. YUI Theater Video library on the discipline of frontend engineering. YUI Test Comprehensive unit testing solution for any JS code.
All YUI projects are BSD-licensed and are available for forking and contribution on GitHub
Getting YUI 3 <script src=/slideshow/yu-open-forall/3506288/&quot; http://yui. yahooapis .com/ 3.0.0 /build/yui/ yui-min .js /slideshow/yu-open-forall/3506288/&quot;> </script> Seed File The YUI module is the single core dependency for all YUI 3.x implementations The YUI module contains loader functionality and a dependency calculator
Using the YUI() one can load all 3.0 utilities, widgets and other custom modules
YUI ( ) Core YUI( config ).use(¡° node ¡±,¡° anim ¡±, function( Y ) { Y. Node ; Y. Anim ; } ); Any number of instances Custom module load can be configured
YUI 3 provides cool utilities that make development on the Browser easy and efficient
YUI 3 Core YUI object Node Event YUI 3 Utilities Animation Cache Cookie DataSchema DataSource DataType DragDrop Get History ImageLoader IO (XHR, XDR) JSON StyleSheet YUI 3 Widget Base Attribute Base Plugin Widget Plugins & widgets Overlay ºÝºÝߣr FocusManager MenuNav YUI 3 CSS Reset Base Fonts
Well documented , lots of code examples
YUI and the Open Source
http:// yuilibrary .com/ gallery /
http:// github .com/yui/ yui3 /
Open Source code Status : ~ 1315 Builds ~ 3040 Commits ~ 20 Committers ~ 4000 Forum posts 1717 Downloads 422 Watchers 22 Forks
#yui IRC channel Twitter @yuilibrary
But Why ??
Open Source is all about community ¡­
¡­ I use your code, you can use mine ¡­
¡­ together we solve a problem and create something awesome !
?
¡° I used to think the browser was the most hostile programming environment ever devised, but then I discovered programming for mobile¡± - Doug Crockford JavaScript architect
YUI aims to make development on browsers less hostile ¡­
¡­ and With a big community working on the problems, they get solved faster and better
Lot of powerful UI controls and experiences can be built out using YUI
?
http://freshcutsd.com/yui-slideshow/ http://www.linkedin.com
YUI Gallery allows all YUI developers to extend the library rapidly , adding modules that are accessible from any YUI 3 use() statement
How can I start contributing ?
1 Get your source from GitHub and set up your work space
2 Fix bugs on existing components or other gallery modules.
3 Create a new YUI module and send it to the YUI team for approval
4 Contribute some working examples or code samples
5 Test components and File bugs
6 Join the forum , participate in discussions and answer queries
7 Write Test cases or update existing tests
8 Raise bugs / Tickets for issues and feature requests
For more information http:// yuilibrary .com/projects/ yui3 /
Do all the hard work for free ?
Thank You !
References http://developer.yahoo.com/yui/ http://yuilibrary.com/ http://developer.yahoo.com/yui/theater/ http://www.slideshare.net/davglass/contributing-to-yui http://www.slideshare.net/caridy/building-yui-3-custom-modules

More Related Content

YUI open for all !

  • 1. YUI 3 Open for all ! Subramanyan Murali Coder, hacker, dreamer
  • 2. Who am I ? Yahoo! Frontend Engineer for 5 years @rmsguhan http://rmsguhan.com YUI User Speaker Photographer Hacker Traveler
  • 3. Yahoo! User Interface Libraries version 3.0 or YUI 3
  • 4. YUI 3 is Yahoo!'s next-generation JavaScript and CSS library
  • 5. Powers many Yahoo! Properties , any so many other web sites around the world
  • 6. YUI 2.x was hugely successful
  • 7. YUI 3 is intended to be more powerful , more feature rich and more Open
  • 8. 2006 YUI project was started 2007 YUI 2.2.0, 2.3.0, 2.4.0 2008 YUI 3.0 pr1 & pr2
  • 9. 2009 YUI 3.0 b1 launched YUI on GitHub YUI 3.0 released YUI 3.0 Gallery
  • 11. So what is the big fuss ?
  • 12. YUI 2 JavaScript core, utilities, widgets; CSS foundation including YUI 3 JavaScript core, utilities; CSS foundation; Gallery. YUI Compressor JavaScript core, utilities, widgets; CSS foundation including YUI Doc Build-time tool for generating API documentation YUI PHP Loader Flexible PHP js/css mgt. solution, includes YUI metadata; combos. YUI Builder Build scripts for generating YUI JS/CSS from source. YUI Theater Video library on the discipline of frontend engineering. YUI Test Comprehensive unit testing solution for any JS code.
  • 13. All YUI projects are BSD-licensed and are available for forking and contribution on GitHub
  • 14. Getting YUI 3 <script src=/slideshow/yu-open-forall/3506288/&quot; http://yui. yahooapis .com/ 3.0.0 /build/yui/ yui-min .js /slideshow/yu-open-forall/3506288/&quot;> </script> Seed File The YUI module is the single core dependency for all YUI 3.x implementations The YUI module contains loader functionality and a dependency calculator
  • 15. Using the YUI() one can load all 3.0 utilities, widgets and other custom modules
  • 16. YUI ( ) Core YUI( config ).use(¡° node ¡±,¡° anim ¡±, function( Y ) { Y. Node ; Y. Anim ; } ); Any number of instances Custom module load can be configured
  • 17. YUI 3 provides cool utilities that make development on the Browser easy and efficient
  • 18. YUI 3 Core YUI object Node Event YUI 3 Utilities Animation Cache Cookie DataSchema DataSource DataType DragDrop Get History ImageLoader IO (XHR, XDR) JSON StyleSheet YUI 3 Widget Base Attribute Base Plugin Widget Plugins & widgets Overlay ºÝºÝߣr FocusManager MenuNav YUI 3 CSS Reset Base Fonts
  • 19. Well documented , lots of code examples
  • 20. YUI and the Open Source
  • 23. Open Source code Status : ~ 1315 Builds ~ 3040 Commits ~ 20 Committers ~ 4000 Forum posts 1717 Downloads 422 Watchers 22 Forks
  • 24. #yui IRC channel Twitter @yuilibrary
  • 26. Open Source is all about community ¡­
  • 27. ¡­ I use your code, you can use mine ¡­
  • 28. ¡­ together we solve a problem and create something awesome !
  • 29. ?
  • 30. ¡° I used to think the browser was the most hostile programming environment ever devised, but then I discovered programming for mobile¡± - Doug Crockford JavaScript architect
  • 31. YUI aims to make development on browsers less hostile ¡­
  • 32. ¡­ and With a big community working on the problems, they get solved faster and better
  • 33. Lot of powerful UI controls and experiences can be built out using YUI
  • 34. ?
  • 36. YUI Gallery allows all YUI developers to extend the library rapidly , adding modules that are accessible from any YUI 3 use() statement
  • 37. How can I start contributing ?
  • 38. 1 Get your source from GitHub and set up your work space
  • 39. 2 Fix bugs on existing components or other gallery modules.
  • 40. 3 Create a new YUI module and send it to the YUI team for approval
  • 41. 4 Contribute some working examples or code samples
  • 42. 5 Test components and File bugs
  • 43. 6 Join the forum , participate in discussions and answer queries
  • 44. 7 Write Test cases or update existing tests
  • 45. 8 Raise bugs / Tickets for issues and feature requests
  • 46. For more information http:// yuilibrary .com/projects/ yui3 /
  • 47. Do all the hard work for free ?
  • 49. References http://developer.yahoo.com/yui/ http://yuilibrary.com/ http://developer.yahoo.com/yui/theater/ http://www.slideshare.net/davglass/contributing-to-yui http://www.slideshare.net/caridy/building-yui-3-custom-modules