Date post: | 18-Jun-2015 |
Category: |
Technology |
Upload: | harsha-vashisht |
View: | 995 times |
Download: | 2 times |
The client side is where strange things happen.
Browsers render in fascinating and totally wrong ways.
Random code from dubious sources interferes with your godlike, clean and high quality code.
...and you fix more than you develop.
The web is a total mess!
To make things work for Yahoo! we needed to find a way to abstract these issues away from us.
And this is why we built the YUI.
YUI is a framework to build working web applications.
It includes CSS solutions to create layouts that work across browsers and allow for predictable typography.
And it takes the pain out of writing JavaScript.
Last but very much not least it allows you to create applications using tested and working widgets that extend what HTML gives
us.
Inte
rface
Wid
gets
Auto Complete Data Table
Button Layout
Calendar Menu
Charts Rich Text
Container Tab View
Everything is fully documented with around 300 examples!
1. Documentationhttp://developer.yahoo.com/yui/docs/
2. Exampleshttp://developer.yahoo.com/yui/examples/
All YUI components come as a debug version which log everything that is going on to the logger.
All in all YUI allows you to build web interfaces without having to know all the pain that goes on in the browser world.
Now, lets have a look at what YUI has to offer.
1. Data Sourcehttp://developer.yahoo.com/yui/3/datasource/
The DataSource Utility provides a consistent API for the retrieval of data from arbitrary sources over a variety of supported
protocols.
1. Remote sources2. Polling3. Caching4. Events
http://developer.yahoo.com/yui/3/examples/datasource/datasource_get.html
YUI allows you to fetch data from YQL directly!
http://developer.yahoo.com/yui/3/examples/yql/simple-yql.html
2. Auto complete
http://developer.yahoo.com/yui/3/examples/autocomplete/ac_datasource.html
3. Data Charts
Now.. I want to draw a graph..
Duck.. There will be codeDuck.. There will be code
My code..
YUI().use('charts', function (Y) { var myDataValues = [ {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} ]; var mychart = new Y.Chart({dataProvider:myDataValues, render:"#mychart"});});
Ain’t that kick ass???
Let us look at the examples page…
http://developer.yahoo.com/yui/3/examples/
Questions???
Some people I need to thank…
1. Christian Heilmann2. Gopalrathnam Venkatesan
Harsha R. [email protected]
http://www.harsharv.comhttp://twitter.com/harsharv
http://www.facebook.com/harsharv