2013/11/17

Introduction to enyoJS

Background

Diverged from xtuple paragraph, enyo is one of xtuple dependencies. Or, in other words, xtuple use this framework to build their client side UI.

Introduction

enyo js
http://enyojs.com/about/
http://enyojs.com/get-enyo/#Bootplate
Difference between enyo and jQuery
jQuery focus on manupliating HTML elements while enyo focus on encapsulating HTMLs as a module and reuse them

Dig deeper

1. Cloning their "blootplate" and play around

The 1st question I would like to ask is what blootplate is.
After reading a while from their reference, I understand several things.
a) You can produce a web page with a minify source easily if you can make use of their shell script and directory structure.
b) If you have not interested on building an APP they claimed like me(well... it means a HTML5 webpage), you can simply read source/App.js. This file control what "debug.html" look like.

2. Diving back to their developer guide

Well... their developer guide make more sense than then point 1 I just pass-through.
I understand 2 more keywords in enyo namespace:
kind: A kind is a JavaScript constructor for an object that's been defined using the enyo.kind method. (That's why you can write `new App()`)
enyo.Control: A kind provided by enyo's core. A factory for users like us to create enyo.instance with user-defined properties.
enyo.Control() VS enyo.kind:
var t = enyo.Control(.....);
t.renderInto(document.body);
enyo.kind({name:'test',kind:enyo.Control...});
var k = new test();
k.renderInto(document.body);


In other word, enyo.kind allows you to publish your enyo.instance to a global namespace as a constructor while enyo.Control return a pointer of your enyo.instance.

3. Walk through their example

Here is their tutorial and here is my github repository, which folk from enyo.bootplate, to play with the provided example.
Notes:
1. "published":
properties insides "published" will be given a setter and getter method.
2. "event handler":
There are 2 parameters, object that's the source of the event and the event object, will be passed into the event handler.
3. "jsonp example":
Since Twitter have updated their APIs, the original example does not work. I have coded another apps in order to try their Ajax wrapping. Not Bad :D

4. Summery

It is fun for me to code with enjo JS. However, there are no too much online sources for you. If you get problems with enjo JS, you better be able to solve it yourself........
PS: Currently, # of jquery tag on stackoverflow is 389,821 while enyo is 120....

5. Useful links

沒有留言:

張貼留言