应用YUI 3设想Web应用地诀窍

原文标题：A Recipe for a YUI 3 Application
原文地址：http://www.yuiblog.com/blog/2011/04/01/a-recipe-for-a-yui-3-application/
译文：应用YUI 3开辟Web应用地诀窍

我们晓得，YUI3地设想不断盘绕着“模块”展开。今天我不想过多正文什么是模块，由于Nicholas Zakas在他地文章”建立可伸缩地前端架构“中已经做了细致阐明。在这里我将着重阐述怎样建立这些模块。文章中地大部分方式都可以从在线文档查阅，并有其它可替代地办法。当然在线API文档地方式大而全。本文只是引见其中地精华地部分——基于YUI3开辟web应用地诀窍，这里地“诀窍”更针对短小精悍地程序场景，不像Nicholas Zakas所指地架构级场景，究竟仅凭本文地篇幅无法全部展开讲述YUI3。

模块地定义

当前第一我们要对模块进行定义，一种罕见地办法是将页面可视区域地不同部分做切分，导航、菜单、正文、边栏面板等等。然后查一下YUI可不可以已经供给了这些模块，比方YUI3就没有供给“菜单”组件，但供给了Node-MenuNav插件，这个插件可以将构造化好地html代码（ul>li）渲染成具有交互行为地菜单。或许你可以间接去YUI Gallery中去找根底组件。不管怎样，你总会找到一种容器或许布局，可以让你往里填充你需求地东西，ok，让我们从这里开端。

我倡议将每个模块都封装进一个文件，放在和文件名同名地目录中，比方weather模块该当放在/weather/weather.js中，这样做地缘由是，有可能你地组件会依赖一些款式，包含css和img等，将这些款式和资源文件放到和js同一个目录下，YUILoader就会很方便地找到他们。这样，款式文件就可以放在weather/assets/skins/sam/weather.css，完全相同，其它图片和款式也可以按这一款方式放置，当然我们假定你没有应用YUI Builder来打包你地项目，这就有点说来话长了。assets目录和skin目录地含义不言自明，但sam目录就搞不懂啥意义了，其实sam是YUI配置和设置项中skin地默许值，指代YUI内嵌组件地默许款式，sam取名自其设想师Sam Lind。因此你也可以应用你地昵称作为你地组件皮肤称号，当然这需求你在YUI全局配置和设置中传入skin参数，简单起见，我们这里只应用默许皮肤。

[1] [2] [3] [4] [5] [6] [7] [8] [9] 下一页