前端资料收集

前端资料收集

css

css地址
CSS 语法参考https://tympanus.net/codrops/css_reference/
CSS 参考手册http://css.doyoe.com/
CSS3动画手册http://isux.tencent.com/css3/index.html
CSS 发抖http://www.webhek.com/post/css-shake.html
CSS3 按钮动画http://fian.my.id/Waves
CSS小工具集合http://linxz.github.io/tianyizone
OOCSS 面向对象的CSShttp://www.oocss.cc/ http://oocss.org/
Animate.csshttps://daneden.github.io/animate.css/
LESS 入门http://www.bootcss.com/p/lesscss/
LESS 文档http://less.bootcss.com/
SASS 入门http://www.w3cplus.com/sassguide/
SASS 文档http://sass.bootcss.com/docs/sass-reference/
Bouncejs 触摸库http://bouncejs.com

*
设计资源

[ 配色表 ] [ 边框样式示例 ] [ 页面背景图片资源 ] [ 页面纹理资源 ] [ Font Awesome ] [ iconfont ] [ icomoon (字体图标制作)] [ 图片处理]

*
前端UI框架

框架地址备注
Bootstraphttp://getbootstrap.com/API完整 PC 移动
Foundationhttp://foundation.zurb.com/响应式 PC 移动
NEJhttp://nej.netease.com/网易 支持桌面及移动平台、浏览器及混合应用开发
NEChttp://nec.netease.com/case国产web 规范统一
Layuihttp://www.layui.com/easy 遵循原生HTML/CSS/JS的书写与组织形式 适合界面的快速开发
Amazeuihttp://amazeui.org/PC端和移动端 easy
SUIhttp://sui.taobao.org/sui/docs//有PC及移动端版本SUI Mobile==>appframework
FrozenUIhttp://frozenui.github.io/轻量 移动端 提供的Animation case
Uikithttp://www.getuikit.com/体积小、反应灵敏的响应式组件
Ionichttps://ionicframework.com/products/HTML5 应用程序开发框架(HTML5混合移动应用程序框架)
MUIhttp://dev.dcloud.net.cn/mui/接近原生APP体验的高性能前端框架 移动端
AUIhttp://www.auicss.com/Material 设计规范,使用MIT开源协议 移动端
Semantic UIhttp://www.semantic-ui.cn/体积小、反应灵敏的响应式组件 移动端
WeUIhttps://weui.io/同微信原生视觉体验一致的基础样式库 移动端
YDUI Touchhttp://www.auicss.com/注重审美,且性能高效的移动端&微信UI
H-uihttp://www.h-ui.net/轻量,兼容性好,服务于中国网站 板式老

*
移动端 js库(插件库)

名称地址备注
Hammer.jshttp://eightmedia.github.io/hammer.js/轻量级的触屏设备手势库 touch,mouse和 pointerEvents
Zeptohttp://zeptojs.com/jquery类似的api 轻量级 具有移动设备的触摸等事件
Swipehttp://swipejs.com/移动端网页触摸内容滑动 滑动特效插件
IScroll 5http://cubiq.org/iscroll-5移动端滚动插件iScroll
iCheckhttp://www.bootcdn.cn/iCheck/对checkbox的美化插件
First Clickhttps://github.com/ftlabs/fastclick为解决移动端浏览器 300 毫秒点击延迟问题所开发的一个轻量级的库
KendoUIhttp://www.kendoui.io/基于最新的HTML5、CSS3和JavaScript标准 快速HTML5 UI
Ratchethttp://goratchet.com/创建Hybrid(混合模式)手机应用APP
jQuery Mobilehttp://jquerymobile.com/基于HTML5的用户界面系统,旨在使所有智能手机,平板电脑和桌面设备上都可以访问的响应网站和应用

*
构建工具及包管理器

名称地址备注
Grunthttp://gruntjs.com/自动化构建工具
Gulphttp://www.gulpjs.com.cn/docs/getting-started/自动化构建工具
Yeomanhttp://yeoman.io/项目工程依赖目录和文件生成工具,项目生产环境和编译环境生成工具 集合:YO、GRUNT、BOWER [ 学习地址 ]
Bowerhttp://bower.io/Web开发的包管理器 专注于CSS、JavaScript、图像等前端相关内容的管理
NPMhttps://www.npmjs.org/Web开发的包管理器,专注于nodeJs模块
Webpackhttp://webpack.github.io/docs/模块加载器兼打包工具,把各种资源,例如JS(含JSX)、coffee、样式(含less/sass)、图片等都作为模块来使用和处理[2.2学习地址]

*
项目管理 (版本管理)

名称地址备注
Githubhttps://github.com/软件项目的托管平台
GitLabhttps://about.gitlab.com/版本管理系统,实现一个自托管的Git项目仓库
Redminehttp://www.redmine.org/基于web的项目管理软件
Githttp://git-scm.com/免费、开源的分布式版本控制系统
Subversionhttp://subversion.apache.org自由开源的版本控制系统
Mercurial (hg)https://www.mercurial-scm.org/版本控制系统

*
调试工具

名称地址备注
Chromehttps://developers.google.com/chrome-developer-tools/谷歌
Firebughttps://getfirebug.com/火狐
HTTPWatchhttp://www.httpwatch.com/http抓包工具,但是只支持IE和firefox浏览器(其他浏览器可能会有相应的插件)
Fiddlerhttp://www.telerik.com/fiddler位于客户端和服务器端的HTTP代理 适用多浏览器[介绍]
IE Developer Toolbarhttps://msdn.microsoft.com/en-us/library/dd565628(v=vs.85).aspxIE调试工具
Weinrehttp://people.apache.org/~pmuellr/weinre/docs/latest/Home.html远程调试工具,借助于网络,在PC上直接调试运行在移动设备上的远程页面

*
图表类插件

名称地址备注
Highcharts 中文APIhttps://www.hcharts.cn/demo/highcharts基于svg技术 文档较详细
Highcharts 英文APIhttp://api.highcharts.com/highcharts基于svg技术 文档较详细
ECharts 百度的图表软件http://echarts.baidu.com/基于canvas 可实现3D图形 效果较好
ECharts 老版本http://echarts.baidu.com/echarts2/doc/example.html基于canvas 文档相对不太详细
高德地图http://lbs.amap.com/api
百度地图http://lbsyun.baidu.com/jsdemo.htm?a#a1_2
开源的矢量图脚本框架http://paperjs.org使用矢量图形和贝塞尔曲线创建场景图/文档对象模型
svg 地图http://jvectormap.com开源JS地图插件[介绍]

*
代码优化

名称地址备注
CSS Linthttp://csslint.net/CSS代码检查工具
JSHinthttp://www.jshint.com/javaScript语法和风格的检查工具
JSLinthttp://www.jslint.com/JavaScript验证工具(非开源)定义了一组编码约定 格式要求严格
JSONhttps://www.json.cn/json序列号工具
Regexperhttps://regexper.com/图形化正则表达式工具

*
代码规范

名称地址备注
Code Guidehttp://alloyteam.github.io/code-guide/HTML CSS
编写可维护的CSShttp://segmentfault.com/a/1190000000388784/CSS
GJS编码规范指南http://alloyteam.github.io/JX/doc/specification/google-javascript.xmlJavaScript
jQueryJS规范http://contribute.jquery.org/style-guide/js/JS

*
测试框架

名称地址备注
Jasminehttp://pivotal.github.io/jasmine/JavaScript 单元测试框架
QUnithttp://qunitjs.com/JavaScript单元测试框架
mochahttp://visionmedia.github.io/mocha/单元测试框架

其他工具

名称地址备注
RunJshttp://runjs.cn/在线编辑器
JSDochttps://github.com/jsdoc3/jsdoc是一个根据javascript文件中注释信息,生成JavaScript应用程序或库、模块的API文档 的工具
Jekyllhttp://jekyllrb.com/将纯文本转换成静态网站和博客
Axure RPhttp://www.axure.com/原型设计
XMindhttp://www.xmind.net/思维导图 原型图 制作查看工具
蓝狐https://lanhuapp.com/ps图解析工具

其他:
前端导航
前端资源导航
大前端
醉牛前端
前端文档工具
前端知识体系
前端资料收集

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值