说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

【开源专访】DWZ团队:致力打造最简单的Web前端开发方式

HTML文档下载 WORD文档下载 PDF文档下载
jUI是DWZ团队开发的基于jQuery的Ajax RIA开源框架,支持用HTML扩展的方式来代替JavaScript代码,使不懂JavaScript的程序员也能使用各种页面组件和Ajax技术。CSDN记者采访了DWZ团队,请他们来详细介绍。

jUI(原DWZ)富客户端框架是DWZ团队开发的基于jQuery实现的Ajax RIA开源框架,支持用HTML扩展的方式来代替JavaScript代码,不懂JavaScript的程序员也能通过jUI来使用各种页面组件和Ajax技术。jUI基于jQuery,你可以非常方便地定制特定需求的UI组件,并以jQuery插件的形式发布。

jUI项目在“2013年度中国优秀开源项目评选”中获得较高票数,并被专家评审团评为“2013年度中国优秀开源项目”。

  • DWZ团队官方微博:http://weibo.com/dwzui
  • jUI(DWZ)项目在线演示地址:http://j-ui.com
  • 项目托管地址:https://code.csdn.net/dwzteam/dwz_jui

CSDN记者采访了DWZ团队,请他们来详细介绍一下jUI框架的由来及他们的开发、开源心得。


从左到右:杜权、张慧华、吴平、郑应海

CSDN:先介绍一下你们的团队吧!

杜权:从事UI/UE前端设计工作,有13年产品设计工作经验。jUI项目发起人,负责用户界面设计、用户体验设计,负责jUI组件HTML结构定义、CSS定义,并负责jUI组件开发完成后的验收工作。

吴平:一直从事Java开发工作,对前端开发也是有一定的兴趣,所以才会参与到这个项目中来。jUI创始人之一,在项目中主要负责jUI组件的JS开发工作。

张慧华:一直从事Java开发工作,对前端开发比较感兴趣,2013年开始从Java转到HTML5手机App开发。在项目中主要负责jUI组件JS开发,以及jUI和Java、PHP整合版本的开发。

DWZ团队目前除了3个创始人,还有几个核心开发人员:郑应海、张涛、冀刚。此外,还有一些没见过面的网友也参与到项目中。

CSDN:jUI项目最初的名字为DWZ,这个名字是怎么来的?后来为什么又改为jUI?

杜权:DWZ取名为“杜权、吴平、张慧华”姓氏拼音首字母,起初由我和吴平用了两个月的业余时间开发了第一版,之后主要是张慧华维护和小步更新。我们想把这套界面框架做成完全自由、开放、安全、不嵌入任何内码的一套界面框架,让它成为行业标准,所以我们重新选择了名字jUI作为框架名称。j的中文寓意很丰富,比如可以代表界面、简单、简洁、教导、焦点、角度等,从技术上可以理解为JavaScript、jQuery、JSON等。而我们三个人又是在Java项目的开发工作中结识,并成为朋友,合作伙伴。

吴平:DWZ这个名字更多的是代表我们这个团队。

张慧华:现在DWZ作为一个团队代号,jUI就是DWZ团队下的一个产品。在DWZ这个团队下还有Java企业级开发框架、ThinkPHP+jUI整合应用、ZendFramewark+jUI整合应用,以后还会有HTML5手机开发框架。

CSDN:jUI项目的开发初衷是什么?

杜权:在我职业生涯中有过多次跳槽经历,做过的大大小小的网站和软件有千余个,从中感觉到无论是大公司还是小公司做开发都存在着同样的问题——做设计的不懂代码,写代码的不懂设计。在整个界面实施的过程中频频遇到设计的界面无法实施到产品中,而我在学设计时对编程也有浓厚兴趣,对编程思想和代码结构都比较清楚,掌握的技术知识面比较广泛,所以对于一个功能呈现到界面上该如何表现,代码结构该怎么写,在这方面理解更深刻。在工作中不断总结方法,发现大多数界面在切割成独立的个体时,代码都可以重用,为了制作界面的工作更简单、更高效,我们尝试在一套HTML上采用不同的CSS来实现多种风格,基于这样的思路把界面代码片段化,分成一个个功能组件,而页面就可以由一个或几个这样的组件组合出来。我们想让JS编码能力稍弱的设计师或程序员学习和使用这种方法,从而提高工作效率,提升代码水平,缩短时间成本。

吴平:最开始我们在公司的项目中也用过市面上的一些组件框架,但始终觉得用起来都挺麻烦的,后来干脆就自己编写组件,后面凭着我们对前端开发的兴趣,决定更系统地开发出全套的组件。至于为什么会开源,应该说源于张慧华的一次尝试。

张慧华:jUI项目开源算起来快4年了,在这之前我们也没有做过开源项目。刚开始我把jUI打了个zip包上传到了CSDN,发现关注的人还挺多,后来就放到Google Code上。当时国内还没有Code平台,第八届开源大会后把代码迁移到CSDN Code平台后下载速度明显快多了。

我们几个属于技术狂热者,平时没事就会一起讨论一下技术问题。都是纯做技术的,没有任何营销经验。通过做开源项目可以认识各方面的人才,建立人脉关系,为以后的发展做准备。就这样慢慢走向了开源之路。

CSDN:jUI的设计思路和具体实现是什么?如何使得开发人员不写JavaScript的情况下,也能用Ajax做项目和使用各种UI组件?

杜权:做界面首先要清楚地理解界面,相信大多数人对界面的理解只是好看不好看,而我对界面感官上的理解首先是把界面和内容分开,无论是产品经理还是界面设计师对界面的理解都是非常重要的,理解不清晰将无法做出一个高性能的产品,将直接影响到整个产品的质量。

那么什么是内容?什么又是界面呢?内容是一个页面要传达给我们的信息,包括文本、图片、媒体等;而界面就是布局和色彩,无论是布局和色彩都是修饰内容用的,包括宽高、位置、边框、投影、大小、颜色、字体等。从技术角度理解界面就是:

  • 用HTML定义内容的类型和结构,正确的内容使用正确的标签定义;
  • 用CSS定义标签的布局、颜色、大小、背景等。

基于界面的用途来定义并规范HTML代码片段,再用CSS选择定义这一块代码片段中标签的具体颜色、边框、字体等来规范一个组件显示什么样的效果,从而使一个页面内的组件可重用多次,而代码却是同一段。

另外,我们针对不会写JS的用户,开发了很多基于传统HTML用法的扩展属性,只要有HTML的基础就能实现很炫的效果。例如:点击一个链接,想让浏览器弹出一个Ajax动态加载的漂浮在当前页面的窗口,而不是打开一个新的浏览器窗口,通过jUI,你只需要一行简单的代码就能搞定,<a href="url"target="dialog">弹出窗口</a>。和传统的链接相比<a href="url" target="_blank">弹出窗口</a>,只是target的属性不同而已,你几乎不需要学习就能使用。

张慧华: 设计思路是:简单实用、扩展方便、快速开发、RIA思路、轻量级。Web 2.0时代的到来,前端开发人员非常稀缺。jUI目的就是让不懂前端,不懂JS的开发人员,也能够做出非常炫的页面效果。jUI就是本着这个原则,添加一些HTML扩展属性,通过class实现自动绑定JS效果。jUI中每个可视化组件都提供有HTML扩展属性调用方式。

jUI基于jQuery,对一些有JS开发经验的开发人员,可以非常方便地扩展其功能。

CSDN:相比其他前端框架,jUI的优势或特点是什么?

  • 完全开源,源码没有做任何混淆处理,方便扩展
  • CSS和JS代码彻底分离,修改样式方便
  • 简单实用,扩展方便,轻量级框架,快速开发
  • 仍然保留了HTML的页面布局方式
  • 支持HTML扩展方式调用UI组件,开发人员不需写JS
  • 只要懂HTML语法不需精通JS,就可以使用Ajax开发后台
  • 基于jQuery,UI组件以jQuery插件的形式发布,扩展方便

CSDN:你们也开发了一些整合项目,比如SSH+jUI、ThinkPHP+jUI、ZF+jUI、YII+jUI,这些项目的目的是什么?未来还会整合哪些项目(框架)?

吴平:这些整合的项目基本都是张慧华一个人的杰作,我跟杜权参与得很少,我们更多是在jUI项目本身上。

张慧华:目前的整合项目有:

  • dwz4j企业级Java Web快速开发框架(Hibernate+Spring+Struts2)+ jUI整合应用
  • dwz4j企业级Java Web快速开发框架(Mybatis + SpringMVC)+ jUI整合应用
  • ThinkPHP + jUI整合应用
  • Zend Framework + jUI整合应用
  • YII + jUI整合应用

这些整合项目主要是为了让开发人员能够更快上手。在实际项目中使用jUI,如果只是看jUI文档,很多地方不好理解,特别是一些和服务器交互性比较强的地方,比如表单提交、列表查询、分页、排序等操作,因为这些不仅仅是前端问题。结合Java和PHP整合版本,开发人员可以更方便地理解和使用jUI。

还有一个原因是我们还想推广dwz4j企业级Java Web快速开发框架,现在该项目还没有相关文档,后续会把文档补上。

CSDN:jUI在浏览器兼容方面表现如何?

吴平:对于浏览器兼容方面我们通过两种途径来解决:一方面,杜权在CSS兼容方面做了大量的工作;另一方面,利用JS来处理一些CSS不太容易处理的兼容性问题。可以说当时在浏览器兼容性方面下了不少工夫,出来的效果至少对于我们自己来说,还算是满意的。

CSDN:在jUI开发过程中,你们是如何分工的?又是如何协作的?你们平时使用的开发工具是什么?

由杜权设计好界面,并以HTML结构形式提交到内部的SVN服务器,然后再根据时间安排分别提交给吴平或张慧华开发具体的JS代码。

杜平在提交HTML时,分别把功能需求写在每个组件的独立页面中,并以注释的方式分别在代码行中描述当前要用的属性和要实现的效果应该怎么控制。JS编码完成后通过内部服务器直接测试,如果没有问题就可以上线。

我们使用的工具如下:

  • Java开发工具:Eclipse
  • PHP开发工具:Zend Studio
  • 前端开发工具:AptanaStudio、JetBrainsWebStorm
  • HTML5移动开发工具:JetBrains WebStorm
  • 设计工具:Photoshop、Illustrator

CSDN:用户如何在自己的项目中整合jUI?

吴平:在自己的项目中整合jUI,我自己认为是比较简单的,因为一般只要按照文档中对组件的描述,正确写组件的HTML代码,并加上对应的扩展属性,基于就可以了。

但对于初次使用的用户来说,jUI的文档可能还不够详细,这里也希望在使用jUI方面有一定经验的朋友,可以分享一下使用心得,感谢不尽。

CSDN:据你们所知,目前大约有多少项目采用jUI?

杜权:我们没有刻意统计过用户量,从朋友和以前的同事提供的信息中得知,至少有几个大公司正在使用我们的框架,比如新浪微博商业后台管理、IBM电子商务解决方案、联通内务管理系统等等。

张慧华:现在jUI有8个1000人的QQ群,我大概从群里了解过,很多人在项目中使用了jUI。

CSDN:jUI在移动平台上表现如何?或者是否有专门针对移动优化的版本?

吴平:之前的版本在移动平台上的表现可能不及在PC上的表现那么好,我们也确实考虑过针对移动设备专门优化一个版本出来。

张慧华:计划以后开发一套HTML5移动App开发框架,可以参照Sencha Toucha的App设计思路,在提供App性能的同时,结合jQuery的简洁语法。

CSDN:jUI未来的发展计划?

张慧华:jUI 2.0 开发了一半,估计暂时放一放了,可以先考虑HTML5手机开发框架。

CSDN:你们如何看待国内的开源环境?对于国内开源领域,你们希望CSDN做些什么?

我觉得国内开源一般都是从非盈利的兴趣爱好项目开始的,很难通过捐赠获利。想要实现盈利可能需要一个全新的盈利模式,比如做技术支持、培训、定制化开发、政府资助、风险投资等。

CSDN可以通过社区的力量共同推进开源软件发展,希望CSDN开源社区能够适应国内开源环境,提供一些特殊功能,能够让开发者、参与者、使用者和社区都能有所收获。比如,社区最好有一个完善的积分系统,来激励大家回答问题,解决问题。针对每个开源项目提供社区版块,方便集中管理开源项目中遇到的各种问题。

【开源专访】系列文章致力于对国内外优秀开源项目作者、团队的专访,挖掘项目背后的故事和更多技术细节,以及对项目的宣传、推广。同时,我们也希望广大开源开发者和爱好者自荐或推荐更多优秀的开源项目。欢迎留言或@CSDN研发频道。

IGT张奇伟:从空间物理到博彩游戏研发 Bing即将推出新功能 用户可直接在搜索结果页购买商品 【开源专访】郑晔谈Moco框架的前世今生以及Java编程之道 CTO俱乐部第108期下午茶:电商在微信上的现状与未来 SDCC 2013讲师议题确定 门票即将售罄(图) 简化工作流程,10款必备的HTML5开发工具 六大领域考评鲍尔默微软掌舵能力,只一“C”尔? 剥离自雅虎的Hortonworks:低调发展,三年融资近1亿美元 Google的中国梦如何死于傲慢与不得力公关 [回顾]昨日黄花,那些被人们遗忘的11个操作系统 管理企业级API的7个最佳实践 Java 与 .NET 的平台发展之争 英特尔正在开发3D深度感知摄像头 可读出人类的情绪等 从数据平台到运营平台:国产开源移动统计Cobub Razor发布0.6版本 八月网络事故频现,CN域名遭最大规模网络攻击 Google云平台或将成为Amazon最大竞争对手 Camera360宣布完成1800万美元B轮融资 利用ZK Ajax框架 高效扩展Web App Web开发者需养成的8个好习惯 GitHub工程师专访:奶昔+海象+游泳池=开源 Paymill发布移动SDK,实现应用内直接支付 免费到付费:全球第二开源Web Server Nginx“堕入”商业化 乐视发布新版智能电视操作系统LetvUI 2.3—Schnauzer 进步还是灾难的开始?科学家首次通过互联网实现“心灵感应” 叫板Apple TV 谷歌发布Chromecast的iOS应用 性能提升100倍的秘密武器:一行SQL代码的妙用 60个开发者不容错过的免费资源库 专门针对初学者的Node.js教程 初创公司Parse.ly:1年内捕获1.6亿独立访问用户,收入增5倍 融资新方式:用未来10年收入的6%融资10万美元 小米手机-HAXLR8on:创客32小时全纪实 问个简单的问题,如何利用子程序改变公共变量数组的值 如何在主页将数据库中内容实现动态公告? 我要买JDBC for SQL Server7.0的jar驱动,谢谢! 求《c++大学教程(第二版)》下载 如何取一个页所有控件的ID值啊! 我的WSAD 5.0的新建“数据库Web页面”,为什么“下一步”和“完成”都不能按?(详情请进!)请帮帮我! 机器被入侵,help 非常简单关于TreeView Control。的问题。喜欢大家帮忙, 求助 一个说易也不易的问题 cookie 只能已天为单位 来过期么? :( 30分钟就国旗 用什么? 请教高手 有些IE不能瀏覽flash文件﹐請問在哪有下載? 求购时间控件,用去web开发 如何才能按照分类显示视图的内容呢? 同志们 再见 接分! 再发一次,ie版本问题怎么解决,100分 请教:在Rational rose中如何去设计数据库表? 为什么wndows2k pro一访问windows2k server就有"打印机"和"任务计划"的共享,可不可以消除? win2k server下,iis5.0有问题,我想卸载,再重新安装,怎么做? treeview的使用小结(一) INDY 资料! 请分析这段代码,谢谢 怎样获得DataGrid的DataSource? 有关struts的问题,返回页面结果不对!在线等待,以解决就结帖 怎么改变快捷菜单PopupMenu1的颜色? 用OWC组件做柱状图,需要显示不同颜色的柱状以及显示不同颜色的图例 VS.NET中如何让自定义的事件出现在属性编辑器中? javascript 中有没有能返回指定某年某月中总天数的函数 如何将主窗体中的变量传到报表中,以供dataset查询用,急急急!!! 新手探路 不知道这是不是一个bug 函数返回值类型问题 兄弟我现在改行搞传统的邮政商业信函业务!给点建议!来者有分! 装有isa客户端的机器不能用FlashGet或者蚂蚁下载 网路多少钱才要交税? Kingofark关于英语及外语学习的50个观点 adotable定位记录有哪些方法?如何使用? 超高难度求sql语句,非高手莫进,在线等.......... petshop有些代碼不明白。。。。。。。。。。。 哎,运算符重载把我卡住了!求救!!! 最后 请问函数传递,设置默认值问题! 通过ODBC连接INFORMIX的问题!急!急!急! 有没有VC高手想在上海找工作? 求一个发送邮件的例子(急!!) 有谁碰到过多人同时改写几十个xml文件从而导致xml文件混乱的情况? 我在datawindow中设置initial vlaue=0,为什么写到数据库里的值还是null 请问联众和中游客户端的聊天大厅是基于chtmlview还是crichedit编程的? WINDOWS高级用户或技术支持人员请进! 通过ODBC连接INFORMIX的问题!急!急!急! 阅读下面这首宋诗,然后回答问题夜 归周 密夜深归客依筇①行,冷燐依萤聚土塍.村店月昏泥径滑,竹窗斜漏补衣灯.【注】 ①筇:此代指竹杖.(1)本诗是怎样以“夜归”统摄全篇的?结合全诗 tell me more 软件 tell me more需要在网络环境下使用吗? 历史上谁做皇帝时间最长? 宾格是什么? tell me more 使用安装tell me more 以后,进入程序时总出现Impossible to access the lessons.Put the TELL ME MORE material into the intended location(DVD-ROM drive or USB 使用这个软件还需要课程么? 我的宾格是什么 我的宾格是什么啊急 我的马苏里拉奶酪不能拉丝了.呜呜今天自己做了pizza,还买了马苏里拉奶酪.但是却拉不出丝来~奶酪我也放了挺多.盘子大小的pizza我放了2片奶酪.奶酪也已经化了呢,但是就是没有拉丝的效果.是 用什么可以治衣鱼? But I have one more.=But I have___. 南航空客380首航悉尼成功外交部就安倍涉华挑衅言论、美监听他国外交部:中方对叙提交化武初始宣布和销张平会见欧洲客人新闻分析:格鲁吉亚大选后内政外交如何新闻人物:格鲁吉亚当选总统马尔格韦拉研究:飞机座椅加宽1英寸 乘客睡眠质IPCC中国宣讲会:21世纪末全球气欧洲一航空公司推“慈善空姐日历” 泳德媒曝美国10年前已监听默克尔通讯 美国国安局:奥巴马并未参与讨论监听默1日交易:慈世平签四川金强 佩顿否认外媒预测:全球气候变暖 夏天将越来越以色列坚持埃及的停火倡议背后的战略因5亿人携肝病毒 世卫组织称肝炎和艾滋\"科波菲尔\"新进展:逃跑少年步行1/3人在存钱 俄罗斯人更愿意用卢布吸引游客 日本政府吁增加支持外国银行弊端渐显 韩国济州岛外国人专用赌场供幸福的生活在哪里?就在美国夏洛茨威尔斋月结束 多个伊斯兰国家宣布庆祝开斋公众安全成重点课题 巴西公安部论坛明
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘