整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

WEB前端开发-程序员最青睐的9个HTML5框架

应式网站开发在国内越来越普遍,一来展现效果好,而来收录情况佳,让专门开发响应式网站的程序员成了香饽饽。程序员们想要更有效率开发响应式网站,这9个热门HTML5框架可不容错过。

①Twitter Bootstrap

基于HTML、CSS、Javascript,简单灵活快捷,是目前很火的前端框架。

②52Framework

能实现HTML5+CSS3+JS,能在包括IE6在内的所有主流浏览器运行。

③SproutCore

利用MVC架构规范构建而成,能与任何后端服务器技术搭配使用。一旦部署之后,SproutCore应用只包含标准的HTML、JavaScript以及CSS。只需使用Apache就能部署完整的SproutCore应用。

④Onsen UI

侧重于创建移动应用,用于构建PhoneGap/Cordova应用。

⑤Foundation

提供多种web上的UI组件,如按钮、表单等,可用于构建基于任何设备上的web应用。

⑥Ionic

Ionic非常漂亮,支持使用HTML5开发混个移动应用前端框架。

⑦Enyo

适用于开发与原生应用类似的HTML 5应用。

⑧GroundworkCSS 2

拥有一个灵活的、可嵌套的网格系统,可以创建适应多种浏览设备的布局。要用于快速构建响应式Web应用程序。

⑨MontageJS

可用于构建高可扩展性和可维护性的HTML5应用。是一个现代化、完整的HTML5框架,旨在创建单页的应用程序。

此外,想开发HTML5响应式网站,还可以借助建站工具。笔者用过一款叫建站宝盒的网站开发工具,做出来的网站可以和专业开发网站媲美,不要求程序基础。有需要的可以了解一下。

这篇文章分享之后我还是要推荐下我自己的前端学习群:527535103 ,不管你是小白还是大牛,小编我都挺欢迎,不定期分享干货,包括我自己整理的一份2017最新前端资料和零基础入门教程,欢迎初学和进阶中的小伙伴

动端web开发框架、类库和UI组件简介,有需要的收藏一波。

react-native

一个基于React的创建原生APP的框架

html5-boilerplate

一个用来构建快速、强大、可适配的webapp的前端模板

ionic

领先的HTML5移动开发框架和SDK,利用你所熟知的web技术构建难以置信的移动应用,是AngularJS最好的朋友。

weui

由微信官方设计团队为微信Web开发量身打造的框架,包含移动web应用开发中有用的组件和模块

hammer.js

实现多点触控的javascript库

weex

阿里推出的跨平台的移动端开发框架,具有轻量级、可扩展和高性能的特点

fastclick

一个消除移动端浏览器上的点击事件的300ms的延迟

zepto

Zepto.jsisaminimalistJavaScriptlibraryformodernbrowsers,withajQuery-compatibleAPI

vux

基于Vue和Weui的移动端框架

wepy

腾讯团队推出的小程序组件化开发框架

NativeScript

NativeScript是一个利用JavaScript等WEB技术创建原生APP的框架

Framework7

功能强大的创建iOS&AndroidAPP的HTML框架

mui

最接近原生APP体验的高性能框架

ratchet

用简单的HTML,CSS,和JavaScript组件创建移动应用

react-native-elements

ReactNativeUI组件库

mint-ui

基于vue.js的移动端UI框架

amazeui

移动端优先的开源HTML5跨屏前端框架,俗称妹子UI

jquery-mobile

jQuery移动开发框架

Mars

腾讯移动Web前端知识库

interact.js

JavaScriptdraganddrop,resizingandmulti-touchgestureswithinertiaandsnappingformodernbrowsers(andalsoIE8+)

vant

有赞开发的基于Vue.js2.0的UI组件库

OnsenUI

用来构建混合移动端APP的HTML5UI框架

muse-ui

基于Vue2.0和MaterialDesigin的UI组件库

SUI-Mobile

SUIMobile(MSUI)是由阿里巴巴国际UED前端出品的一个手机端的UI库,轻量精美。更多信息请参考官网

ant-design-mobile

一个可配置的移动端UI框架

TouchSwipe-Jquery-Plugin

TouchSwipeisajqueryplugintobeusedwithjQueryontouchinputdevicessuchasiPad,iPhoneetc.

jquery-weui

创建微信混合app的UI库

jquery-ui-touch-punch

AduckpunchforaddingtoucheventstojQueryUI

device.js

Device.jsmakesiteasytowriteconditionalCSS_and/or_JavaScriptbasedondeviceoperatingsystem(iOS,Android,Blackberry,Windows,FirefoxOS,MeeGo),orientation(Portraitvs.Landscape),andtype(Tabletvs.Mobile).

react-native-ui-kitten

可定制和可重用的react-native组件包

iview-weapp

一套高质量的微信小程序UI组件库

vonic

基于Vue.js和ionic组件的SPAUI框架

brick

UIWebComponentsforModernWebApps

app

App.js是一个用来创建移动webapp的轻量级JavaScriptUI框架,可以表现得像原生APP而又不牺牲性能和优雅

Lungo.js

一个给开发者提供的设计、构建、分享跨设备应用的框架

AlloyFinger

腾讯Web前端团队推出的轻量级的多点触控手势库

FooTable

jQueryplugintomakeHTMLtablesresponsive

vue-ydui

一个基于Vue2.x的移动端组件库

wechat-h5-boilerplate

为腾讯微信优化的H5动效模板,帮助你快速构建全屏滚动型H5页面

slip

通过滑动和拖动手势操作列表的UI库

mobi.css

一个关注于移动端的轻量级的、灵活的css框架,

vue-touch

Vue.js的Hammer.js包装器

QuoJS

针对移动设备的微型JavaScript库

pressure

:point_down::boom:JavaScriptlibraryforhandlingbothForceTouchand3DTouchontheweb

junior

一个创建类似原生APP的html5应用的前端框架

vum

为手机webapp打造的基于Vue.js构建的UI框架

mobiscroll

ThecustomizablemobileUIlibraryfortouchdeviceslikesmartphonesandtablets

zingtouch

一个JavaScript触摸手势检测库

montage

montagejs是一个优雅的、开源的HTML5框架。它提供了模块化组件,双向数据绑定,以及更多功能

pushy

Pushyisaresponsiveoff-canvasnavigationmenuusingCSStransforms&transitions

GMU

基于zepto的ui组件库,适用于移动端

flex.css

flex.cssis是一个声明式的布局框架,能够兼容多个MVVM框架和浏览器

mobilebone

单页切换骨架。适用于移动webAPP,Hybrid混合APP,Phonegap开发,无兼容要求单页PC应用等

jquery.pep.js

Pep,alightweightpluginforkineticdragonmobile/desktop

Cloudajs

CloudaFramework-一个针对移动WebApp的实时JavaScriptRIA框架

jo

Jo(0.5.0)是一个轻量级的(~16K)创建HTML5应用的外壳。可以和PhoneGap,Chrome,Safari,Opera,FireFox,iOS,Android,BlackBerry10,Tizen,&WindowsPhone8+一起工作

touchui

高质量移动端UI框架

iosselect

一个简洁好看的模仿ios的webapp下拉菜单

mand-mobile

面向金融场景的Vue移动端UI组件库,丰富、灵活、实用,快速搭建优质的金融类产品

tabris-js

tabris.js-用JavaScript开发原生应用

aui

移动端UI快速布局解决方案(APICloudUI框架)

vue-carbon

基于vue开发的materialdesignui库

cordova-plugin-ibeacon

AniBeaconpluginforPhonegap/Cordova3.xandupwards.SupportsbothiOSandAndroid(contributionsarewelcome)

touch.code.baidu.com

TouchOfficalSite

bindingx

阿里团队推出的weex和ReactNative上富交互问题的一种解决方案

jQuery-Touch-Events

AcollectionofmobileeventpluginsforjQuery.

TinyNav.js

Responsivenavigationpluginthatweighsjust443bytes

Jingle

JingleUI是一个基于html5、css3开发轻量级的移动webapp框架,提供一些基本交互方式,帮助您更方便的开发移动应用。

light7

一个轻量级的易用的移动端UI框架

framework7-vue

基于Framework7和Vue构建iOS和Android应用

ydui

一只注重审美,且性能高效的移动端&微信UI

slip.js

移动端跟随手指滑动组件,零依赖。

wepayui

微信支付场景化组件,wepayui源码

BlendUI

BlendUI是Clouda+中的重要组成部分,他能让webapp的用户界面体验和交互能和Native媲美

toucher

面向移动端的手势类库

touchjs

一个移动端手势检测库

thumbs.js

Addtouchsupporttoyourbrowserwiththumbs.js-asmall,transparent,andsyntax-lesslibrary.

JMUI

移动Web开发UI组件库

JM

面向Mobile的极致JavaScript库

react-ui

为React打造的一套ionic风格的可复用UI组件库

Zoomage.js

Zoomage.js-一个通过手势缩放图片的库

touchSlider

TouchSliderjQueryPlugin

如今移动端开发领域H5势头越来越猛,不管是H5小应用、小游戏,还是hybrid混合开发都有不少市场。原生端APP开发越来越不能满足快速迭代的诉求。而随着手机硬件配置的不断增强。以前抱怨的手机端web app性能低下声音也越来越少了。下面随小编一起来看下,这么多年来乔老爷子推崇的HTML5进化到了哪种程度。炸裂推荐50+款流行框架,不论新旧,总有一款适合你。

RAD.js

rad.js是一个快速建立移动应用程序的框架。优化iOS,Android和Windows Phone 8,以及支持所有主流的Web浏览器。

查看地址:http://rad-js.com/

Ionic

Ionic是一款接近原生体验的Html5移动APP开发框架。Ionic既是一个CSS框架也是一个JavaScript UI库。通过SASS + AngularJS + Cordova 来构建应用程序,它提供了很多UI组件来帮助开发者开发强大的应用。能想到的基础组件都能在这里找到。结合丰富的Cordova插件,提升与原生交互功能。在iOS和Android端用户体验上有不错的表现。

查看地址:http://ionicframework.com/

LungoJS

一款向需要设计构建跨终端应用的开发者提供的HTML5框架。

查看地址:http://lungo.tapquo.com/

Mobile Angula UI

一款基于Bootstrap3和Angular的手机端HTML5 UI框架。

查看地址:http://mobileangularui.com/

NativeScript

使用Angular,TypeScript或者原生JavaScript来构建真正原生手机APP的开源框架。

查看地址:https://www.nativescript.org/

Sencha Touch

如果你使用过Ext,easyUI这类框架来构建web2.0时代管理台的话,那么你使用Sencha Touch时一定不会感到陌生。一款基于html5和JavaScript的跨平台手机应用框架。

查看地址:http://www.sencha.com/products/touch/#overview

PhoneGap

要想将制作好大web app放到手机里,逃不开应用打包的过程。大名鼎鼎PhoneGap就是加壳工程的鼻祖。现如今开源部分改名为Cordova。强大的插件机制,让web前端开发者有机会体会原生组件的魅力。想要自己封装hybrid应用,学习Cordova源码里的优化设计代码是一个非常重要的部分。

查看地址:http://phonegap.com/

RhoMobile

面向消费者与企业开发人员的移动应用程序平台。

查看地址:http://rhomobile.com/

jQuery Mobile Framework

jQuery大名不用小编介绍了,jQuery mobile是一款早期推出的手机端跨终端UI组件库。和jQuery UI风格类似。喜欢使用jQuery的朋友不要错过。

查看地址:https://jquerymobile.com/

Onsen UI

基于自定义元素构建移动前端的HTML5框架。

查看地址:http://onsen.io/

Apache Flex

一款构建web与手机应用的开源项目框架。从早期adobe Flash中分离出来,出使用action script或者h5的方式构建富客户端,以flash player,或者adobe air运行时环境。

查看地址:https://flex.apache.org/

Agate Mobile Application Framework

一款跨平台开发ios、Android原生应用,不能用于开发web app。

查看地址:http://applusform.com/en/

eMobc

用XML来开发生成web、手机和原生端应用的开源框架。

查看地址:http://www.emobc.com/

AppGyver Steroids

构建混合应用程序所需的工具集,提供iOS和Android的测试人员和开发人员。

查看地址:http://www.appgyver.eu/

Application Craft

一整套的跨平台应用开发解决方案,从设计到开发,各种方便的IDE。不过是收费的。

查看地址:https://www.applicationcraft.com/

ChocolateChip-UI

chocolatechip UI是一个开发移动Web应用程序框架。你只需要了解三种东西:语义化的HTML5标签、CSS和JavaScript。

查看地址:http://chocolatechip-ui.com/

DHTMLX Touch

同样老牌的组件库框架,从桌面端转到移动端,提供同样可靠及丰富的组件。

查看地址:http://dhtmlx.com/docs/products/dhtmlxTouch/

Corona Labs

强大的跨平台手机端框架之一,使用Lua脚本语言作为开发语言,有自己的2D的游戏引擎。主要适用于开发游戏。

查看地址:https://coronalabs.com/

Framework7

完美还原原生端组件的H5框架。

查看地址:http://www.idangero.us/framework7/

Gideros

Gideros是一个免费的并且开源的框架,提供了跨平台开发优质游戏的方式。你只需要几个小时就可以构建出你的伟大游戏。开发语言是Lua。

查看地址:http://giderosmobile.com/

未完待续。。。更多精彩实用的框架请看下集~