Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

移动开发资源 #20

Open
moocss opened this issue May 26, 2015 · 16 comments
Open

移动开发资源 #20

moocss opened this issue May 26, 2015 · 16 comments

Comments

@moocss
Copy link
Contributor

moocss commented May 26, 2015

https://github.com/iqiyi/LiteApp (LiteApp 是高性能的移动跨平台方案,LiteApp is a high performance mobile cross-platform implementation, The realization of cross-platform functionality is base on webview and provides different ideas and solutions for improve webview performance.)

https://github.com/AlloyTeam/AlloyLever (搞定开发调试发布,错误监控上报,用户问题定位 )
https://github.com/WechatFE/vConsole(一个轻量、可拓展、针对手机网页的前端开发者调试面板。)

https://github.com/liriliri/eruda (手机网页的前端开发者调试面板 👍 💯 )


http://www.uigreat.com/page/guifan (移动UI 尺寸设计规范。:+1: :100: )

https://github.com/yangfeiloveG/Useful-project-code (webapp 开发常用方法技巧 👍 💯 )


https://github.com/JsAaron/es6-magazine (基于es6的app模版 👍 💯 )
跨平台,可在所有载有webkit引擎设备上运行
实现各种分辨率自适应,横竖模式自适应缩放
实现在线预览
实现模拟翻页线性切换
实现模拟跳槽切换
实现几十种基于css3的复杂动画
实现部分webgl动画
实现14种事件编程与手势交互
支持上百种动画组合
支持视频与音频
支持路劲动画
支持多层的视觉差效果
支持svg无损缩放
支持底层接口调用
支持脚本代码注入
支持用户自定义编程
等等...
环境

开发:基于es6
测试:基于webpack+express+rollup+gulp搭建,有热替换功能
发布:基于gulp+rollup 单文件打包
测试:基于karma+mocha+chai


https://juejin.im/post/59c4c9d85188254f58412d17 (移动 Web 开发问题和优化小结)

https://github.com/bang590/JSPatch (JSPatch 可以让你用 JavaScript 书写原生 iOS APP, 很酷 👍 💯 )

https://realm.io/cn/ (Realm,为移动设备而生 替代SQLite和Core Data。 👍 💯 )

http://novajs.com/index.html (小巧易用的 Web Component 框架, 360奇舞)

https://selfstore.io/products/367 (Producter - 让产品从 0 到 1 👍 💯 )

http://www.jianshu.com/p/decc90744121 (原型\UX 设计软件Fuse的安装及其初探)
https://www.fusetools.com/ (Fuse为开发者和设计师提供一系列应用设计开发套件,用来创建原生的、跨平台的iOS和Android移动应用程序 👍 )
http://www.jianshu.com/users/479842929433/latest_articles (Fuse 文档翻译 👍 )

http://blog.zhowkev.in/2015/12/25/shi-yong-fuse-zhi-zuo-producter-app/(使用 Fuse 制作 Producter App)

http://www.alloyteam.com/2016/01/points-about-resource-loading/ (研究首屏时间?你先要知道这几点细节)

http://isux.tencent.com/nine-question-of-swipe-html5-page.html (滑屏 H5 开发实践九问)

http://tips.producter.io/15-fen-zhong-gao-su-ni-guan-yu-fuse-de-yi-qie/ (15 分钟带你入门 Fuse 👍 )

http://toutiao.io/subjects/51753 ( 手机百度前端开发,如何切图 👍 💯 )

http://h5.noear.org/ (h5 浏览器)

http://uxfan.com/fe/css/2016/01/19/marvel.html (微博移动样式框架Marvel.css开发心得 )

https://github.com/zuojj/fmui (FMUI(Finance Mobile UI) 移动端组件库, 基于Zepto 👍 💯 ,学习)

http://m.sui.taobao.org/ (framework7的改造)
https://github.com/lihongxun945/light7 (msui 的克隆版)
http://framework7.taobao.org/ (framework7中文版)

https://github.com/BelinChung/HiApp (framework7 例子)

http://75team.github.io/novaUI/ (基于Zepto的移动UI组件库 👍 💯 ,学习)

http://frozenui.github.io/ (腾讯,FrozenUI是什么 Frozen UI是一个开源的简单易用,轻量快捷的移动端UI框架,有丰富的案例。- 推荐使用 - scss 👍 )

https://github.com/tgideas/motion (Motion 是一款基于ZeptoJS,为移动终端Web应用量身定制的组件库,重点开发结合HTML5新特征的创新实用组件。:+1:)

https://github.com/dcloudio/mui(最接近原生APP体验的高性能前端框架. 👍 💯 学习,SCSS)

https://github.com/muicss/mui (MUI is a lightweight CSS framework that follows Google's Material Design 👍 💯 )

https://github.com/weui/weui (为微信 Web 服务量身设计, 👍 💯 )

https://github.com/ElemeFE/mint-ui (饿了团队, 基于 Vue.js 的移动端组件库 👍 💯 )

https://github.com/ydcss/ydui (一只注重审美,且性能高效的移动端&微信UI。jQuery 版, 👍 💯 )

https://github.com/CMUI/CMUI (百姓, 移动UI库,CMUI 是一个专攻移动网页的 UI 框架,它提供了丰富的组件和简洁的接口,开箱即用。 👍 💯 💯 )

https://github.com/WechatFE/vConsole (A front-end developer tool for mobile web page., 移动webapp 调试器)

https://github.com/doyoe/Yo (Yo 是基于 Mobile First 的策略而设计,并使用 Sass 开发的 CSS Framework,具备轻量,易用,可配置,强扩展等特性,同时也适应于PC端的高级浏览器。 👍 )
https://github.com/guhuina/Gu (移动前端CSS Framework)

https://github.com/imweb/sheral (腾讯, jquery2 + sass 版移动UI库, 👍 💯 学习 )

https://github.com/moyus/sparrow (Sparrow是一款针对移动web app开发的前端轻量级框架. 👍 💯 学习 )

http://ionicframework.com/
https://github.com/ParryQiu/GuGuJianKong ( Ionic Framework, 咕咕监控 👍 💯 )
http://blog.parryqiu.com/2015/11/22/ionic-development-issues/ (Ionic 开发中遇到的问题以及后期发布 iOS/Android 的方方面面 👍 💯 )

https://github.com/teambition/teambition-mobile-web (Teambition Mobile Web App, ionic 👍 )

https://github.com/andrew1991823/Ionic-EShopping ( 购物网站, 👍 )

https://onsen.io/patterns.html(OnSen UI是一个前端开发框架,适合PhoneGap/Cordova混合应用的开发。OnSen UI自身使用Angular.js和Topcoat开发,由于其架构特性,可以便捷的使用Angular.js的特性。)

https://github.com/ampproject/amphtml (AMP,来自 Google 的移动页面优化方案)
https://imququ.com/post/amp-project.html (AMP,来自 Google 的移动页面优化方案)

http://ued.qunar.com (去哪儿前端开发解决方案)

http://ued.qunar.com/mobile/guide/ (Touch页面开发流程及环境搭建)

https://github.com/amfe/lib-flexible (可伸缩布局方案 👍 💯 )
http://imochen.github.io/hotcss/ (移动端布局终极解决方案 👍 💯 )
https://github.com/ximan/flexible.rem (移动端弹性布局(rem)解决方案)
amfe/article#17 (使用Flexible实现手淘H5页面的终端适配 )

http://www.html-js.com/article/Mobile-terminal-H5-mobile-terminal-HD-multi-screen-adaptation-scheme%203041 (【原创】移动端高清、多屏适配方案)

https://github.com/dexteryy/CardKit (A mobile UI library ,豆瓣 )

https://github.com/unbug/generator-webappstarter/blob/master/app/templates/app/src/util/MetaHandler.js (动态修改Viewport Meta Tag :网易移动前端已经实践近4年的移动端适配各种屏幕无痛工具脚本)

http://docs.spmjs.io/anima-yocto/latest/ (Yocto是Anima官方提供的dom操作基础库,它的根基来源于Zepto,同时在Zepto的基础上做了很多的优化和重构。)

http://www.cnblogs.com/yexiaochai/p/4876099.html ( 使用MVC模式拆分复杂的业务页面,组件化编程,【组件化开发】前端进阶篇之如何编写可维护可升级的代码 - 携程 webapp 架构)
http://www.cnblogs.com/yexiaochai/p/3837713.html (【blade利刃出鞘】一起进入移动端webapp开发吧)

http://www.cnblogs.com/yexiaochai/p/4219523.html (浅谈移动前端的最佳实践)

https://github.com/mob-framework/mob (mobile版bootstrap, 专为 | 移动网页开发而生 ,百度母婴网站 👍 )

https://github.com/o2team/paipaimo-base (拍拍无线基础库)

http://f2e.souche.com/blog/yi-dong-duan-zi-gua-ying-fang-an/ (移动端自适应方案调研 👍 )

http://weizhifeng.net/you-should-know-about-dpi.html (移动开发需要知道的像素知识『多图』)

https://github.com/nolimits4web/swiper/ (强大的图片轮换插件 👍 )

https://github.com/AlloyTeam/AlloyTouch (腾讯,60FPS的触摸运动:+1: :100:)
https://github.com/AlloyTeam/AlloyFinger (腾讯, 一个小巧的多手势支持事件库 , 原生版和 React 版:+1: :100:)

https://github.com/zingchart/zingtouch (现代的,人性化化 手势事件库, ES2015 👍 💯 )

http://touch.code.baidu.com/ (百度 Touch.js是移动设备上的手势识别与事件库 👍 💯 )
https://github.com/Clouda-team/boostui(百度移动 👍 💯 )
https://github.com/Clouda-team/boostui-native (百度移动 👍 💯 )
https://github.com/Clouda-team/BlendUI2 (百度移动 👍 💯 )

http://be-fe.github.io/iSlider/ (百度 , 移动设备上最强的,表现出众,无任何插件依赖的手机平台javascript滑动组件 👍 💯 )

https://github.com/iinterest/Squirrel-3 (Squirrel 前端 Web 框架, 学习 👍 💯 )
http://hisquirrel.com/index.html (Squirrel 3 前端 Web 框架, 学习 👍 💯 )

https://github.com/huxiaoqi567/xscroll (A Javascript Scrolling Framework For Mobile Web, 移动滚动条 👍 💯 )

https://github.com/yanhaijing/zepto.fullpage ( 原生+ zepto , 移动全屏滚动插件, 学习 👍 💯 )

https://github.com/singod/mbox (mBox是为移动设备(手机、平板等webkit内核浏览器/webview)量身定做的弹层插件,插件采用JavaScript编写,您需要按照场景选择使用。插件开源、体积小、简单实用、功能强大,是你架构移动终端网站的重要选择!)

https://github.com/ciaoca/cxBase (用于移动端 Web 的基本样式)

https://github.com/1340641314/cloud ( 原生js, 实现的一个移动端轻量级的弹层插件 👍 )

https://github.com/jgthms/lavalamp.js (加载更多, 动画,非常酷 👍 💯 )

https://github.com/HOUCe/infinite-scroll-list (无线滚动,入门与精通 , 👍 💯 学习)

http://alloyteam.github.io/AlloyTouch/ (Smooth scrolling, rotation, pull to refresh, page transition and any motion for the web 👍 💯 💯 )

http://am-team.github.io/antui/docs/#Dialog 对话框

UI

https://github.com/alibaba/weex-ui (A rich interaction, lightweight, high performance UI library based on Weex. 👍 💯 💯 )

https://github.com/qiuguorong/bxui

路由

https://github.com/progrape/router (A very simple router for the demo of WeUI)

https://github.com/1340641314/Xrouter (采用原生js实现的前端路由插件)

http://qianduan.guru/2016/08/13/gesture_detection_in_html5/ (HTML5 手势检测原理和实现 )

rem

https://github.com/chesscai/flexible-adaptive (基于淘宝适配方案flexible + 翻屏h5 适配方案adaptive(移动端全屏滑动h5活动解决方案))

http://www.jianshu.com/p/985d26b40199 (手机端页面自适应解决方案—rem布局进阶版)

https://github.com/hbxeagle/rem/blob/master/HD_ADAPTER.md (『REM』手机屏幕高清适配方案)

https://github.com/minooo/React-Study/tree/master/step-03 ( React 购物网站模板, 底部导航,好店列表,以及下拉菜 的实现, antd mobile 0.8 以上版本「高清」方案设置 👍 👍 💯 , 学习)
https://github.com/minooo/React-NetEase
https://github.com/ant-design/ant-design-mobile/wiki/antd-mobile-0.8-%E4%BB%A5%E4%B8%8A%E7%89%88%E6%9C%AC%E3%80%8C%E9%AB%98%E6%B8%85%E3%80%8D%E6%96%B9%E6%A1%88%E8%AE%BE%E7%BD%AE ( antd mobile 0.8 以上版本「高清」方案设置 👍 👍 💯 , 学习)

https://juejin.im/post/58e4cedc61ff4b006b32c8e5 (移动端 H5 页面注意事项)

https://github.com/gajus/scream (动态视口计算 👍 💯 💯)

案例

http://m.qidian.com/female/ (阅文移动网站 👍 💯 💯 )

https://github.com/yued-fe/drag-loading (基于窗体滚动的下拉释放加载或者刷新)
https://github.com/yued-fe/inertia (移动设备上任意元素在屏幕内惯性弹动)

apicloud

https://github.com/tower1229/HybridStart (基于apicloud的混合应用开发框架)

@moocss
Copy link
Contributor Author

moocss commented Jun 25, 2015

http://frozenui.github.io/ ( FrozenUI的CSS组件库,基于腾讯手Q样式规范)

@moocss
Copy link
Contributor Author

moocss commented Jun 25, 2015

http://alloyteam.github.io/Rosin/ (Rosin是一个Fiddler插件,协助开发者进行移动端页面开发调试,是移动端web开发、调试利器。)

@moocss
Copy link
Contributor Author

moocss commented Jun 25, 2015

http://am-team.github.io/about/about.html (支付宝移动组 无线Web解决方案 - AM)

http://docs.spmjs.io/alice-mobile/latest/# (支付宝无线端UI样式库)

@moocss
Copy link
Contributor Author

moocss commented Jul 31, 2015

1号店移动开发组 :
https://github.com/TVVT/Zero (1号店移动端前端流程 )
http://ximan.github.io/mobileBug/ (移动端bug集合)
https://github.com/ximan/mobile-layout-example/tree/gh-pages (移动端布局示例 👍 💯 ,移动布局技巧 )
https://github.com/TVVT/Zero (1号店移动端前端流程 )
http://ximan.github.io/network/ ( 移动端网络连接判断)

https://github.com/TVVT/book/blob/master/knowledge/meta.md (html meta)
https://github.com/ximan/dropload (移动端下拉刷新、上拉加载更多插件 👍 💯 )
https://github.com/minirefresh/minirefresh (优雅的H5 下拉刷新。零依赖,高性能,多主题,易拓展。(A Graceful HTML5 Drop-Down-Refresh Plugin. ) 👍 💯💯)
https://github.com/ximan/useZepto (Zepto常用方法)

https://mango.github.io/slideout/ (移动侧栏导航)
https://github.com/mango/slideout (移动侧栏导航 👍 💯 💯)

https://github.com/blivesta/drawer/

@moocss
Copy link
Contributor Author

moocss commented Aug 9, 2015

@moocss
Copy link
Contributor Author

moocss commented Aug 9, 2015

http://75team.github.io/novaUI/ (可参考前端移动库建设,Widgetcore由Class.js, Base.js, Widget.js组成。)

@moocss
Copy link
Contributor Author

moocss commented Sep 25, 2015

http://blog.qqbrowser.cc (微信调试原来如此轻松)

@moocss
Copy link
Contributor Author

moocss commented Oct 23, 2015

https://modao.cc/ (在线的手机APP原型设计)

@moocss
Copy link
Contributor Author

moocss commented Dec 4, 2015

http://www.jianshu.com/collection/de345d7149f2 (App产品策划大全 👍 )

@moocss
Copy link
Contributor Author

moocss commented Jan 25, 2016

https://github.com/meandmax/lory (支持手势的 slider 👍 )

@moocss
Copy link
Contributor Author

moocss commented Jan 26, 2016

http://www.cnblogs.com/lyzg/p/4877277.html (从网易与淘宝的font-size思考前端设计稿与工作流)
http://www.cnblogs.com/lyzg/p/5058356.html (淘宝弹性布局方案lib-flexible实践)
http://www.cnblogs.com/lyzg/p/5117324.html (基于淘宝弹性布局方案lib-flexible的问题研究)

@moocss
Copy link
Contributor Author

moocss commented Feb 20, 2016

@moocss
Copy link
Contributor Author

moocss commented Apr 7, 2016

移动混合开发:

http://www.kerkee.com/ (搜狐, 新一代高性能、低成本,快速开发的跨平台Hybrid框架 👍 💯 )

chemdemo/chemdemo.github.io#12 (Hybrid APP架构设计思路)

@moocss
Copy link
Contributor Author

moocss commented Apr 18, 2016

在线案例

  1. http://m.beibei.com/

@ferrisBreeze
Copy link

辛苦了 点赞

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants