YUI Introduction, Tutorials, and Resources
During the first years of the Internet, web pages were quite boring. Users who browsed them came across web pages they could not interact with much, since they contained only text, images, and links.
Yahoo! released major versions in 2006 and 2009, with the last release in 2014. YUI was halted as a result of declining interest among developers and an increased usage of server side scripting through libraries like Node.js.
These tutorials will help beginners get started with the YUI library.
- YUI Introduction Slides provide an introduction to the library aimed toward beginners and was presented by Christian Heilmann at Web Directions North 2009.
- Create Rich Interface with the YUI Library is a step by step tutorial from Wired Magazine that describes how to add rich features to a web page such as carousel controls and calendars.
- YUI 3 Changes is an article that provides details on some of the differences between YUI 2 and YUI 3.
- YUI Skinning describes how to change the "look and feel" of widgets and controls from YUI.
- YUI Examples provides tons of examples developers can use to get started with YUI development and create rich interfaces.
- An Introduction to YUI provides information on YUI library features including DOM, event handlers, animation modules, and Ajax requests — complete with code examples.
Developers can also take a look at the following video tutorials to help learn YUI:
- YUI Basics is a video tutorial that provides and overview of the YUI library.
- YUI DataTables is a video tutorial provides an overview of the DataTable components. It includes code examples, and is presented by one of the engineers who worked on YUI.
- YUI Mojito shows how developers can create web applications using the Mojito, an MVC (Model View Controller) framework for YUI.
- When Not to Use YUI is an entertaining but informative video tutorial that demonstrates what situations warrant the use of YUI.
- Events Evolved presents a talk by Luke Smith on handling DOM, synthetic, and custom events using YUI. Web applications are largely event driven so this is a tutorial worth checking out.
Additional Learning Resources
Many sites offer tutorials covering a broad range of topics related to YUI. Here are some websites that beginning and advanced developers will find useful.
- YUI Library Website is a website that features many articles on the YUI library. By browsing this website, developers will be able to get quickly started with development of YUI based applications, view documentation, view tutorials, and chat with the rest of the developer community on YUI topics.
- GitHub not only stores various code repositories for YUI, the website also feature tutorials on changing the look and feel of various widgets and making code modifications.
- AlloyUI includes several tutorials with in-depth code examples using the AlloyUI library which was built on top of the YUI3 library. Developers visiting the website can download the libraries and learn how to implement many features including carousels, progress bars, and data tables.
Books on YUI
Unlike many other languages and libraries, there are just a few good books on YUI. They give a complete introduction to YUI and provide some in-depth examples.
- Learning the Yahoo! User Interface Library (2008), by Dan Wellman, provides developers with a good overview of YUI with detailed examples. Developers reading the book will get exposed to beginner and advanced concepts. No prior experience is assumed.
- YUI 3 Cookbook (2012), by Evan Goer, features multiple snippets of code or "recipes" that solve specific problems that developers can directly use on their projects. Some of the examples in the book include ways to create animations, debug code, create components, and handle events.
Since the last release of YUI was in 2014, developers may want to consider alternative frameworks. Some popular alternatives include jQuery, which is used in a majority of websites. Here are some jQuery resources to consider.
- W3Schools jQuery Tutorial teaches developers many of the library's features including basic syntax, implementing event handlers, and selecting HTML elements. W3Schools also allows developers to modify and execute code on the website itself.
- jQuery Course is an online class from CodeCademy for developers to learn the basics of the library and implement projects.
Is it Worth Learning YUI?
Though the development of YUI was discontinued by Yahoo, learning it could still improve your skills. By learning YUI, you gain an exposure to another framework model. Learning this framework can help you understand similar libraries such as jQuery or AngularJS.
Further Reading and Resources
We have more guides, tutorials, and infographics related to coding and website development:
- Composing Good HTML: this is a solid introduction to writing well-formed HTML and using HTML validator software.
- CSS3 — Intro, Guides & Resources: this is a great place to start learning webpage layout.
- Learn and Master jQuery: our introduction to jQuery.
What Code Should You Learn?
Confused about what programming language you should learn to code in? Check out our infographic, What Code Should You Learn? It not only discusses different aspects of the languages, it answers important questions such as, "How much money will I make programming Java for a living?"