近日，第四届HTML5峰会在北京国际会议中心拉开序幕，云适配携其“HTML5跨屏前端框架Amaze UI”高调亮相，并在大会上了做了《组件化-Web前端开发的未来趋势》的重要演讲。

HTML5跨屏前端框架Amaze UI受到了广大程序员喜爱

组件化是Web开发的未来趋势

Web组件化（WebComponents）理念，自Google在2013年的I/O大会上提及起，一直都有开发者关注这一开发技术的发展，只是总处于不愠不火的状态。直至去年HTML5规范的正式定稿，Web开发也随之异常火爆，让Web组件化的关注度也随之水涨船高，从今年的HTML5峰会吸引了8000多HTML5的爱好者、开发者来参会就能略见一斑。

据云适配创始人兼CEO陈本峰介绍，组件的技术标准在前端一直都是缺失的，直到Google提出以后，才有了Web Components标准。在此之前，大家都不知道怎么去封装一个组件。Web组件化其实一直都被国外互联网公司看好，因为从软件架构上、开发效率上、代码可维护性上都是一个更好的选择。但因为Web Component标准还未正式定稿，所以Amaze UI 选择Facebook React 作为 Web组件封装标准，并遵循React所推崇的“一切皆组件”的组件化理念，实现从小到一个按钮，大到一个页面，甚至一个完整App都可以组件化。

Amaze UI是云适配在其开发过程中把积累的包括菜单、轮播图等在内的大量针对手机端的UI控件组件化后开源出来形成的，通过拆分、封装了一些常用的网页组件，开发者只需复制代码便可将这些跨屏组件写入到自己的应用中。在过去的一年里，Amaze UI以开源的形式提供了包含16个 CSS 组件、26个 JS 组件，更有20款包含近 60 个主题的 Web 组件, 此外，针对国内主流浏览器及 App 内置浏览器提供了更好的兼容性支持并接入了更多本土化的因素帮助解决中文排版问题，使开发者不需要再花费时间精力去编写日历等的代码，便可以直接引用组件。

正是因为如此，自2014年8月份正式上线后，Amaze UI就受到了众多前端工程师的喜爱，经历短短的1年的产品迭代，吸引了超过25万开发者的加入，同时，Amaze UI 在 GitHub 上的星级关注突破了5000，基本上是国内开源软件增长最快的一个了。

Amaze UI的下一步计划

讲到Amaze UI的优势，陈本峰认为最大的优势就是积累，第一，云适配在Web Components上积累了很多经验，以及组件数量；第二，云适配积累了对各种设备、浏览器的兼容性和适配性，这点是真的要靠点滴累积的，别人很难去超越。第三，Amaze UI是一个开源框架，这也算是一个优势，就像一个社区，开发者肯定会挑最大的框架使用，因为在使用中遇到问题的话，只要在网上搜索就能找到答案，而选择新框架的话，碰到问题也不容易找到帮助。

从目前互联网的大局势发展来看，PC互联网正在向移动互联网急速地转移，开发者急需能够解决重复繁复的跨屏、适配问题，让PC网站、新建的网站或者移动应用更好地适应移动端的前端开源技术，但限于技术门槛和开源环境的不成熟，市场上解决跨屏适配问题的开源项目却基本上寥寥无几。

开源的HTML5跨屏前端框架Amaze UI恰逢其时。据介绍，除了提供基于HTML5的前端跨屏组件外， Amaze UI 将在后续的开发工作中，还将陆续推出Amaze UI for App、Amaze UI组件市场等更多提高开发效率的工具；同时，随着Amaze UI产品的不断丰富、功能完善及开发者数量急剧增多及相应的需求增多，AmazeUI也将推出社区方式运营，从而与开发建立更高效的沟通渠道，及时获得开发者需求及反馈，从而以更专业的方式来服务开发者。

据悉，Amaze UI for App是一个只针对移动端的版本，它的开发是为了满足多种应用场景，让移动应用开发者们用Amaze UI开发出接近于原生的HTML5移动应用：

1)       开发原生 App，需要快速出代码级别的交互原型。

2)       移动营销快速搭建移动站点

3)       基于BaaS 或者第三方 API，做一个有趣的应用，不需要后端；

4)       Hybrid App，不可能把一个臃肿、低效的响应式的网站打包进 App；

着HTML5开发的火热，如今国内各行业都开始进入HTML5领域，抢占红利，造就了职场新贵，HTML5开发成了一轮企业热招岗位。初学HTML5你并不需要任何的原生应用编程经验，你只需要一些HTML、CSS和JavaScript的知识。不可否认HTML5将会越来越好，因为移动端的硬件也会越来越强，其实你手机上的很多应用已经悄悄的使用混合式开发了，这也许就是HTML5的魅力所在吧。

目前已经有很多的框架可以帮助你开发跨平台的移动应用，在这篇文章中，千锋武汉HTML5培训的老师只介绍最牛的7个HTML5移动开发框架。

1、IONIC

IONIC是目前最有潜力的一款HTML5手机应用开发框架。通过SASS构建应用程序，它提供了很多UI组件来帮助开发者开发强大的应用。它使用JavaScript MVVM框架和 AngularJS来增强应用。提供数据的双向绑定，使用它成为Web和移动开发者的共同选择。即将发布的AngularJS 2.0将会专注于移动开发，相信IONIC一定会取得不错的成就。

IONIC的开发团队将尽快开发出一种通过IONIC creator提供开发者快速创建IONIC应用的方式。我们将很快就会看到一个支持拖拉功能的可视化开发工具，几分钟内开发一个app将成为可能。

2、Mobile Angular UI

Mobile Angular UI是使用bootstrap 3和AngularJS的响应式移动开发HTML5框架。

Mobile Angular UI的关键字有：

Bootstrap 3

AngularJS

Bootstrap 3 Mobile组件，比如switches, overlays和sidebars，这些都是bootstrap中没有的。

AngularJS modules，比如 angular-route, angular-touch 和 angular-animate

响应式媒体查询是将bootstrap作为单独的文件，你只需要包含你所需要的东西。Mobile Angular UIu并不包含任何jQuery依赖，你需要做的只是通过一些AngularJS指令创建友好的用户体验。

详细了解可以看一看the Mobile Angular UI demo page，上面有Mobile Angular UI的实践，如果你想了解的更深入一些，我建议你读一读 getting started with Mobile Angular UI。

3、Intel XDK

Intel XDK 是Inter开发的一款跨平台开发工具，我们可以很容易的通过Intel XDK开发应用，你需要做的只是下载他们的应用开发工具，有Linux、Windows和Mac版，它还提供了很多个开发框架，比如Twitter bootstrap， jQuery Mobile和Topcoat。

4、AppceleratorTitanium

Appcelerator’s Titanium不同于其它框架的是，它是一个开源的框架。

Titanium是混合式移动应用开发的一站式解决方案，你只需要下载Titanium studio就可以解决所有的事情，Titanium SDK包含了很多手机平台的APIs和后端云服务。

Titanium使用 Alloy，Alloy是一个快速开发的手机应用MVC框架，模块式开发可以大大减小开发时间，提高代码复用。

Titanium studio 还提供了一些code模板。

5、Sencha Touch

Sencha Touch同样也是HTML5手机应用跨平台开发框架，运行iOS/Android/Blackberry。它已经诞生很多年了，现在已经成为很常用的混合式编程开发框架。

Sencha Touch可以让你的Web App看起来像Native App。美丽的用户界面组件和丰富的数据管理，全部基于最新的HTML5和CSS3的 WEB标准，全面兼容Android和Apple iOS设备。

下面是千锋武汉HTML5培训的老师总结出的几点特性：

基于最新的WEB标准——HTML5，CSS3，JavaScript。整个库在压缩和gzip后大约80KB，通过禁用一些组件还会使它更小。

支持世界上最好的设备。Beta版兼容Android和iOS，Android上的开发人员还可以使用一些专为Android定制的主题。

增强的触摸事件。在touchstart、touchend等标准事件基础上，增加了一组自定义事件数据集成，如tap、swipe、pinch、rotate等。

数据集成。提供了强大的数据包，通过Ajax、JSONp、YQL等方式绑定到组件模板，写入本地离线存储。

6、Kendo UI

Telerik’s Kendo UI 是一个强大的框架用于快速HTML5 UI开发。基于最新的HTML5、CSS3和JavaScript标准。

Kendo UI包含了开发现代JavaScript开发所需要的所有一切，包括：强大的数据源，通用的拖拉(Drag-and-Drop)功能，模板，和UI控件。

7、PhoneGap

PhoneGap 恐怕是最老的一个框架了，相信很多人都已经听说过甚至使用过它，但是PhoneGap是基于开源的 Cordova 商业版本。

第一段PhoneGap代码是在2008年8月的iPhoneDevCamp上写成的。创建它的一个主要动力是基于一个几乎每一个单独的iPhone开发新手都要面对的简单事实：Objective-C是一个对Web开发人员来说非常陌生的环境，并且Web开发人员的数量远远多于Objective-C开发人员的数量。

问题是，是否有人可以开发一个框架，让Web开发人员可以利用他们所有的HTML、CSS和JavaScript知识，而且仍旧可以同iPhone的重要本地应用程序(如摄像头和通讯录)交互呢？

就在那一年，PhoneGap获了奖并开始支持Android平台，对人数不断增长的移动开发人员变得越来越有用，这些人员需要在更多的平台上获得代码支持。

大家可以到PhoneGap documentation官方文档开始对PhoneGap的学习。

总结

在这篇文章中，千锋武汉HTML5培训的老师跟大家讨论了一些HTML5的移动开发框架，HTML5正式发布之后，很多开发者对HTML5又重燃了希望，相信这是个美好的时代，相信它会给我们带来更多的惊喜。