35
Qué es ?

Que es YUI

Embed Size (px)

DESCRIPTION

Pasado y presente de YUI. Una introducción a los conceptos detrás de YUI como proyecto

Citation preview

Page 1: Que es YUI

Qué es ?

Page 2: Que es YUI

YUI

i18n

accesibilidad

widgets

librería

framework

DOM

desacoplado

módulos

I/O

documentación

gráficos

mixins

monkey-patch

comunidad

tests

Page 3: Que es YUI

Yahoo! User Interface Library

Page 4: Que es YUI
Page 5: Que es YUI

var nodes = YAHOO.util.Selector.query('.meetup');

YAHOO.util.Dom.addClass(nodes, 'js'); 

YAHOO.util.Dom.setStyle(nodes, 'display', ''); 

Page 6: Que es YUI
Page 7: Que es YUI

Y.all('.meetup').addClass('js').show();

Page 8: Que es YUI

$('.meetup').addClass('js').show();

Page 9: Que es YUI

http://www.jsrosettastone.com/

Page 10: Que es YUI

YUI

i18n

accesibilidad

widgets

librería

framework

DOM

desacoplado

módulos

I/O

documentación

gráficos

mixins

monkey-patch

comunidad

tests

Page 11: Que es YUI

YUI

i18n

accesibilidad

widgets

librería

framework

DOM

desacoplado

módulos

I/O

documentación

gráficos

mixins

monkey-patch

comunidad

tests

Page 12: Que es YUI

Módulos

Page 13: Que es YUI

YUI().use('mi-modulo', function (Y) {

Y.MiModulo.empezar();

});

Page 14: Que es YUI

YUI.add('mi-modulo', function (Y) {

Y.MiModulo = { empezar: function () {} };

}, {requires:[‘node‘, ‘event‘]);

Page 15: Que es YUI

http://yui.yahooapis.com/combo?3.14.0/yui-base/yui-base-min.js&3.14.0/oop/oop-min.js&3.14.0/event-custom-base/event-custom-base-min.js&3.14.0/querystring-stringify-simple/querystring-stringify-simple-min.js&3.14.0/io-base/io-base-min.js

URLs Combinadas

Page 16: Que es YUI

http://yui.yahooapis.com/combo?3.14.0/yui-base/yui-base.js&3.14.0/json-stringify/json-stringify.js

http://yui.yahooapis.com/3.14.0/json-parse-shim/json-parse-shim.js

Carga condicional

Page 17: Que es YUI

…y mucho más

Page 18: Que es YUI

Principios

Page 19: Que es YUI

http://yui.github.io/yuidoc/

Page 20: Que es YUI
Page 21: Que es YUI
Page 22: Que es YUI

Y.Overlay = Y.Base.create("overlay", Y.Widget, [ Y.WidgetStdMod, Y.WidgetPosition, Y.WidgetStack, Y.WidgetPositionAlign, Y.WidgetPositionConstrain]);

Page 23: Que es YUI

Comunidad

Page 24: Que es YUI

YUI-Ext Ext JSComunidad

Page 25: Que es YUI

Comunidad

Page 26: Que es YUI
Page 27: Que es YUI

Reviewers Commiters

@ericfYahoo

@lsmithSmugMug

@rgroveSmugMug

Page 28: Que es YUI

Futuro

Page 29: Que es YUI

CSS

Page 30: Que es YUI

express-state

app.use(function (req, res, next) { res.expose(req.path, 'url.path'); next();});

https://github.com/yahoo/express-state

Page 31: Que es YUI

npm install yui-promise

Page 32: Que es YUI

CSS

Page 33: Que es YUI

http://purecss.io/

Page 34: Que es YUI

Estándares

Page 35: Que es YUI

Gracias @juandopazo

juandopazo

yuilibrary.com