Your SlideShare is downloading. ×

Yui mixer

770

Published on

Quick i

Quick i

Published in: Technology, Art & Photos
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
770
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
5
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • How many have used YUI?How many have done FE dev?Design Patterns - Use
  • Transcript

    • 1. YUI
      Open Hack Day mixer session
      Harsha Vashisht
      mail@harsharv.comhttp://www.harsharv.com
    • 2.
    • 3. THOMAS ALVA EDISON
      NIKOLA TESLA
    • 4. The web is a total mess!
    • 5.
    • 6. Auto Complete
      Data Table
      Interface Widgets
      Button
      Layout
      Menu
      Calendar
      Rich Text
      Charts
      Tab View
      Container
    • 7. Everything is fully documented with around 300 examples!
    • 8. 1. Documentationhttp://developer.yahoo.com/yui/docs/2. Exampleshttp://developer.yahoo.com/yui/examples/
    • 9. Now, lets have a look at what YUI has to offer.
    • 10. 1. Data Sourcehttp://developer.yahoo.com/yui/3/datasource/
    • 11. The DataSource Utility provides a consistent API for the retrieval of data from arbitrary sources over a variety of supported protocols.
    • 12. Remote sources
      Polling
      Caching
      Events
    • 13. http://developer.yahoo.com/yui/3/examples/datasource/datasource_get.html
    • 14. YUI allows you to fetch data from YQL directly!
    • 15. http://developer.yahoo.com/yui/3/examples/yql/simple-yql.html
    • 16. 2. Auto complete
    • 17. http://developer.yahoo.com/yui/3/examples/autocomplete/ac_datasource.html
    • 18. 3. Data Charts
    • 19. Now.. I want to draw a graph..
    • 20. Duck.. There will be code
      Duck.. There will be code
    • 21. My code..
      YUI().use('charts', function (Y)
      {
      varmyDataValues = [
      {category:"5/1/2010", values:2000},
      {category:"5/2/2010", values:50},
      {category:"5/3/2010", values:400},
      {category:"5/4/2010", values:200},
      {category:"5/5/2010", values:5000}
      ];
      varmychart = new Y.Chart({dataProvider:myDataValues, render:"#mychart"});
      });
    • 22. Ain’t that kick ass???
    • 23. Let us look at the examples page…
      http://developer.yahoo.com/yui/3/examples/
    • 24. Harsha R. Vashishtmail@harsharv.com
      http://www.harsharv.comhttp://twitter.com/harsharv
      http://www.facebook.com/harsharvhttp://www.slideshare.net/harsharv

    ×