Alloy ui basic tutorial

Few points about alloy ui : Alloy ui is a library which built on the top YUI3 library. It uses the concept of sandbox. It is a meta framework for building rich ui web pages.

Sandbox concept for js:

This concept uses the call back concept for running the code. It provides the functionality of adding the module (s) on demand for accessing its defined functions. How to create sandbox?

YUI().use(arg1,arg2…….argn,function(A){

//code will be added here.

});

Let us discuss about the above created sandbox.

1. YUI () function creates new instance of YUI.
2. On this new instance use method is being called which can zero or n no. of modules as a string parameters but last parameter will be a callback function.
3. Here function (A) is a callback function and it is having A as an argument which nothing but new instance which is being created by YUI () function.
4. it loads the dependencies which are e being called as modules here on demand.

Let’s create a simple hello world example to demonstrate the above

The following steps needs to be followed in order to create a hello world:

1. Add the seed file (which is like a js library file) to the using < script > tag and related css file.
2. Create the sandbox as mentioned above.
3. Now supply an alert message to this sandbox.

Seed js file and css file

http://cdn.alloyui.com/2.0.0/aui/aui-min.js 

http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css

< script >

var checkObj=YUI();

checkObj.use(function(A){

alert("Hello World");

});

< /script >

Live Demo : Alloyui Basic Test

Let’s discuss how to use packages in the next tutorial in the series of basics of alloy ui.