frontend-resources icon indicating copy to clipboard operation
frontend-resources copied to clipboard

平常收集的一些资源

#Koala With Frontend Development Resources

下面的资料都是我平时收集的一些前端资源。有些资料可能不属于前端,纯属收藏来着,喜欢就拿走。^_^

  1. 推荐指数: ★ 一颗星 ☆ 半颗星
  2. 中文标注: (中)
  3. 有些网站可能需要翻墙,翻墙推荐使用[GoAgent] (http://code.google.com/p/goagent/)

######Compatibility 兼容性

  • [Dottoro Web Reference] (http://help.dottoro.com/llqwxqoe.php) 非常有用的web参考,资料规划得非常好。 ★★★☆
  • [Can I use] (http://caniuse.com/) 提供的功能在html5,css3,svg和其他即将出现的web技术的兼容性表。★★★★
  • [W3help] (http://w3help.org/zh-cn/) 提供W3C标准,兼容性的根本原因,知识库,案例分析。★★★☆ (中)
  • [findmebyip] (http://www.findmebyip.com/litmus/) 提供HTML5标准在各个浏览器的兼用情况。

######Documentation 文档、手册

  • [DevDocs] (http://devdocs.io/) 感觉是最好用的API文档查找手册。
  • [CSS参考手册] (http://css.doyoe.com/) 包含css2.1、css3 ★★★☆
  • [CSS3动画手册] (http://ecd.tencent.com/css3/guide.html) 由腾讯ECD出品。
  • [ECMAScript5.1中文版] (http://ecmascript.cn/)
  • [ECMAScript5.1英文版] (http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf)

######Design Tools Web设计工具

  • [谷歌设计工具] (https://www.google.com/webdesigner/) 创建HTML5动画,运行于任何设备。★★★☆

######Online Edit 在线编辑

  • [CSSDeck] (http://cssdeck.com/) 收集令人惊叹的css和js的作品,以帮助前端开发人员和设计人员。 ★★★☆
  • [CodePen] (http://codepen.io/) 和CSSDeck性质一样的站点,访问有点慢,不过里面的作品相当给力。 ★★★
  • [Compilr] (https://compilr.com/) 在线解析和编译。支持C,C++,C#,JAVA,HTML,CSS,JAVASCRIPT,NODEJS,PHP... 相当神的一个网站。★★★
  • [Dabblet] (http://dabblet.com/) 在线编辑HTML 和 CSS
  • [jsdo] (http://jsdo.it) 貌似是日本人做的一个网站,性质和上面那些一样

######Online Tools 在线工具

  • [开源中国在线工具] (http://www.ostools.net/) 各种各样的工具、文档,相当给力。★★★☆
  • [Closure Compiler] (http://closure-compiler.appspot.com) js压缩,可以看到压缩后的大小,以及gzip后大小 ★★
  • [CSS 验证] (http://jigsaw.w3.org/css-validator/) 检查层叠样式表(CSS)文档和HTML或者XHTML文档中的CSS内容
  • [JS beautifier] (http://jsbeautifier.org/) Beautify, unpack or deobfuscate JavaScript and HTML, make JSON/JSONP readable, etc.
  • [jslint] (http://www.jslint.com/) 检测javascript代码质量
  • [CSS LINT] (http://csslint.net/) 帮你找出你CSS中的问题。不光是语法错误,它还能指出你的代码写的不合理的地方,或者不高效的地方。
  • [holmes.css] (http://www.red-root.com/sandbox/holmes/) 这个CSS可以帮你找出你网页中写的不标准的HTML代码。
  • [在线编辑CSS3代码] (http://enjoycss.com/gZ/1) 这个工具很不错。

######Game Engine 游戏引擎

  • [Impact] (http://impactjs.com/) 收钱的
  • [Phaser] (http://docs.phaser.io/) 一个2D的游戏框架。

######Animation library 动画库

  • [Raphaël] (http://raphaeljs.com/) 通过SVG/VML+JS实现跨浏览器的矢量图形实现方案,支持IE6+、Firefox 3.0+、chrome、opera。★★★☆
  • [prepareTransition] (https://github.com/snookca/prepareTransition)
  • [Three.js] (http://mrdoob.github.com/three.js/) javascript的3D库
  • [Animate.css] (http://daneden.me/animate/) 很酷,有趣的跨浏览器的动画库,当然支持现代浏览器。

######Image library 图像处理

  • [Pixastic] (http://blog.nihilogic.dk/2008/03/jsimagefx-javascript-image-effects.html) 使用javascript和canvas处理图像。
  • [Face] (http://people.opera.com/richt/release/demos/device/facerecognition/) 脸部识别的一个demo

######Audio library 音频处理

  • [Dancer] (http://jsantell.github.com/dancer.js)

######Time library 时间处理

  • [Pikaday] (https://github.com/dbushell/Pikaday) 时间选择控件。
  • [Moment] (https://github.com/timrwood/moment/) 功能是分析、验证以及处理时间数据。

######Performance Optimization 性能优化

  • [性能调优攻略] (http://www.oschina.net/question/28_58930)

######FONT 字体

  • [Browse Fonts] (https://www.fontfont.com/fonts) 提供了非常多的字体浏览。
  • [ICOMOON] (http://icomoon.io/#home) 字体图标
  • [FONTPREP] (http://fontprep.com/) 修改字体

######Search Tools 搜索工具

  • [Microjs] (http://microjs.com/) 搜索JavaScript库,还行。不同通常都是直接Google搜来着。
  • [Angular Modules] (http://ngmodules.org/) Angular模块搜索。
  • [Npm Search] (http://npmsearch.com/) NPM模块搜索。
  • [Javascript OO] (http://www.javascriptoo.com/) 展示了很多项目可以用到的JS类库。还提供了demo,非常贴心。

######Web Security Web安全

  • [前端安全科普] (http://www.csser.com/board/4f93781fac1fd192290005dc#/post/4f94b6fdcdb37f734d00025d)
  • [关于p3p 简洁策略,以及浏览器的支持情况.] (http://www.cnblogs.com/_franky/archive/2011/03/16/1985954.html)

######WebGl相关的资料

  • [AlteredQualia] (http://alteredqualia.com/)

######Node.js相关的资料

  • [Node.js-Best practices] (http://www.slideshare.net/the_undefined/nodejs-best-practices-10428790)

######Other 其他

  • [W3C] (http://www.w3.org/) The World Wide Web Consortium
  • [Mozilla] (https://developer.mozilla.org/zh-CN/) mozilla的开源社区,各种文档,各种demo
  • [Opera] (http://dev.opera.com/) Opera的开发社区
  • [Safari] (http://developer.apple.com/library/safari/navigation/)
  • [W3Techs] (http://w3techs.com/) 提供网络上各种类型的技术被使用的信息情况
  • [JS 设计模式] (http://shichuan.github.com/javascript-patterns/) 里面收集了各种设计模式的资源。
  • [nodejsmodules] (http://nodejsmodules.org/) 显示nodejs模块的流行度。
  • [softpedia] (http://www.softpedia.com/) 各个平台,各种语言的软件平台。
  • [jster] (http://jster.net/) JSter是一个由社区驱动的、最流行实用的JavaScript库的列表,开发者可以在该网站中按照分类查阅相对应的JavaScript库。
  • [CSS3=Awesome] (http://css3.bradshawenterprises.com/) 一个专门介绍CSS3的网站。
  • [Esprima] (http://esprima.org/demo/parse.html) ECMAScript解析器
  • [it-ebooks] (http://it-ebooks.info/) IT 电子书网站
  • [Unicode character table] (http://unicode-table.com/en/) 可以很方便的查找unicode字符。