【原始地址】:http://www.chencheng.org/blog/2008/10/25/f2e-manual/
一直觉得前端开发缺个手册,这是个体力活。不过总得有人来干。

今天闲来无事,把一些工具(online和client的)、常用网址、以及经验总结等罗列出来和大家分享下。这个标题起地大了点,肯定会有很多地方没列到,包括类目的分法也可能考虑不周,所以还请大家积极补充指正,可以直接留言,也可以发邮件给我(sorrycc#gmail.com)。之所以加上“大众”两字,因为以下资源对于高手来说可能早就很熟悉了。

另外想提一句,工具是死的,好不好用得看你会不会用。比如Firefox、Fiddler等,除了显而易见的功能以外,都有一些小的技巧,掌握了可以让你事半功倍。

更新记录:

  • [20081025] 第一版

快捷导航:

  • 在线工具集
  • 常用Firefox插件
  • IE下的调试工具
  • 参考手册
  • 批处理工具
  • IDE及其他工具
  • Bookmarklet
  • 前端开发者社区及权威网站
  • 推荐订阅的博客和网站

另外还搞了个Firefox插件《前端开发工具集》,把资源整合到一个菜单下,方便查询。数据放在线上(Google AppEngine),速度应该会有保证,更新也会比较方便哈,见图。

在线工具集

  • 书籍类:

    • Book Shelf 2.0 beta —— 荐,分类很清晰,下载很方便
    • Book Go!
    • 原版图书免费下载链接收集站
    • 51CNNET.NET
  • JavaScript类:
    • Beautify JavaScript —— JavaScript格式化工具,效果很理想
    • AJAX Libraries API
    • Regex Tester
    • Compressor Packer —— 以前一直用这个压JS,自从有了TBCompressor,就放弃他了
  • CSS类:
    • CSS选择器性能测试
    • CSSTidy —— CSS格式化工具
    • CSS Compressor  —— CSS压缩
  • 其他:
    • GUID 生成器 —— 做某些东西(Firefox插件)时需要唯一资源标志符时用
    • W3Counter
    • WebWait - Benchmark Your Website

常用Firefox插件

  • 支付宝安全控件 和 旺旺协议 —— 网购专用,Firefox+浦发网银,无敌了
  • Firebug —— 这个不用介绍了吧,附空帏的外部编辑器乱码修正版
    • Firecooike —— 支持Cookie的查看和编辑
    • Jiffy —— 调试性能的,用起来比较麻烦,没试过
    • YSlow —— Why Slow? YUI出品
    • Pixel Perfect —— 把设计稿直接拖到Firefox里进行对比
    • Rainbow for Firebug —— JS高亮,性能不是很理想
  • Fiddler 开关 —— 简化在Firefox里切换Fiddler的操作,感谢Taobao UED的空帏同学
  • Web Developer
  • DevBoi —— 把Html, Dom, JavaScript等手册放在侧栏里,可以自定义增加,快捷键Ctrl+F9。可以在这里找到更多的Package。
  • RefControl —— 针对每个站点发送想要的HTTP Referer
  • GreaseMonkey —— 看某个网站不爽,写个小脚本来优化下还是不错的
  • HttpFox —— 查看当前Http链接状态,类似IE下的HttpWatch
  • User Agent Switcher —— 切换User-Agent,同时开发iphone和web版本的时候很方便
  • FoxyProxy —— 穿墙工具,配合专业代理公布器使用很和谐

IE下的调试工具

  • Fiddle2 —— 非常强悍的一款http流查看工具,默认支持IE,其他浏览器可以设置将{Document}\Scripts\BrowserPAC.js设为代理进行使用。Firefox下可用上述"Fiddler 开关"进行快速切换。支持插件。
  • IE Developer Toolbar —— 查看元素、禁用缓存、禁用CSS\JS、Outline元素、查看生成的源码等功能,IE8自带了一个加强版的。
  • Microsoft Script Debugger + Companion.JS —— 调试JS用,虽然报错还是有误差,但是我已经满足了。安装顺序是:Microsoft Script Debugger,Companion.JS,在"IE选项-高级"里取消禁用脚本调试。
  • 多版本IE共存两种方案:
    • IE7/8 + IE Tester —— 大众型配置,可以基本满足日常需要。
    • IE6 + Internet Explorer Collection—— 在IE 6用户占绝对优势以及IE 6神奇bug满天飞的时代,我还是推荐这种方案,因为只有神奇的原装IE6,才能抵挡运营神奇的问题。另外如果还有其他机器可供支配的话,建议再装个IE 8 + IE Tester,因为IE 8下的DeveloperToolbar还是有很大改进的,调试起来会方便一些。
  • 以下三个软件相对不重要些:
    • HttpWatch —— http流查看
    • Instant Source —— 可查看JS生成的源码
    • NetLimiterPro —— 网速限制

参考手册

  • XHTML、CSS & DOM W3C 手册 —— 玉伯整理的版本,包含了W3C手册以及其他有用的资料。
  • 苏昱的CSS中文手册和Dom中文手册
  • JScript语言参考
  • XML指南
  • XMLHTTP参考手册
  • jQuery 1.2.6 API和jQuery and jQuery UI Reference 1.2
  • Apache 2.2 中文版参考手册在线版
  • MySQL 5.1 参考手册 (在线版)
  • PHP手册
  • YUI Cheatsheet
  • Cheat Sheet Roundup - Over 30 Cheatsheets for developers
  • 23个Cheatsheet打包下载

批处理工具

  • TBCompressor —— 淘宝UED的JS/CSS压缩工具,详见玉伯的介绍
  • pngOptimizer —— png优化工具
  • jpegTran —— jpeg去冗余meta工具

IDE及其他工具

  • Editplus v301 汉化版
  • Tortoise SVN
  • 移动版本的 Apache + PHP —— 灰常灰常好用,灰常灰常移动,见明城的说明

Bookmarklet(右键另存)

  • Firebug Lite —— 官方介绍
  • Xray —— 官方介绍
  • MRI —— 官方介绍
  • ‘+ window.document.documentElement.outerHTML+ ”">查看生成的源码,‘+ window.document.documentElement.outerHTML+ ”);})()">打开新窗口查看生成的源码 —— for IE

开发者社区及权威网站

  • Mozilla Developer Center (MDC)
  • YAHOO! Developer Network (YDN)
  • Dev.Opera
  • Apple Developer Connection
  • MSDN
  • IBM Developers中国 (Web 前端开发技术专题)
  • WebKit
  • AOL Developer Network
  • SlideShare - Share PPT —— 在线PPT分享,资源丰富
  • Google Doctype —— Web开发人员的百科全书
  • W3C (香港,中国)
  • Position Is Everything
  • HTML Dog
  • 维基百科

推荐订阅的博客和网站(排名不分先后)

  • 国外

    • 内容聚合:A List Apart,Ajaxian,Smashing Magazine,456 berea street,Script & Style,CSS Globe,CSS-Tricks,SitePoint
    • 团队Blog:Yahoo! User Interface Library (YUI),IEBlog
    • 个人Blog:John Resig,PPK: QuirksMode,Douglas Crockford,Dean Edwards,Nate Koechley,Julien Lecomte,Eric A. Meyer,Andy Budd,Steven Levithan,HedgerWow
  • 国内
    • 内容聚合:Blueidea,无忧脚本,网页设计师(W3CN),JavaScript教程网
    • 团队Blog:淘宝,口碑,阿里巴巴国际站,阿里巴巴中文站,阿里巴巴中文站前端开发团队(方凳),阿里妈妈,支付宝,阿里软件,19楼,九天音乐,金蝶与友商网
    • 个人Blog,这里列出的是原创并更新相对频繁的博客,如有遗漏,请告之(sorrycc#gmail.com):怿飞,手气不错,Realazy,old9(需穿墙术),沙滩凉鞋(空帏),射雕(玉伯),Aether,振之,嗷嗷,JunChen,爆牙齿,秦歌,克军,5key,小志,Rage(正淳),麦鸡,云烈,老冒,番茄红了,Joyqi,卢力,CSS森林(Ghost),Twinsen,Gulu77,Rlog,Dlog,子鼠,西风坊 …

转载于:https://www.cnblogs.com/justinw/archive/2009/12/27/1633562.html

[Share]前端开发大众手册(包括工具、网址、经验等)相关推荐

  1. 前端开发大众手册(转)

    一直觉得前端开发缺个手册,这是个体力活.不过总得有人来干. 今天闲来无事,把一些工具(online和client的).常用网址.以及经验总结等罗列出来和大家分享下.这个标题起地大了点,肯定会有很多地方 ...

  2. Web 前端开发规范手册

    Web 前端开发规范手册 一.规范目的 1.1 概述 二.文件规范 2.1 文件命名规则 2.2 文件存放位置规范 2.3 CSS 书写规范 基本原则: 注意细则: 命名规则: id的命名: 基本样式 ...

  3. 前端开发进阶手册.pdf

    开课吧前端团队精心打造的<前端开发进阶手册>来了,这套系统的前端资料,能够帮助大家更好掌握面试技巧和热门知识点: 面试多次,老是通过次数少/薪资低人一大截: 了解多个单独的技术点,但缺乏体 ...

  4. 前端进阶(8) - 前端开发需要了解的工具集合:webpack, eslint, prettier, ...

    前端开发需要了解的工具集合:webpack, eslint, prettier, ... 前端开发需要了解的一些工具,这些工具能够帮助你在项目开发中事半功倍. 1. nrm: npm registry ...

  5. CSS参考手册_web前端开发参考手册系列

    CSS参考手册_web前端开发参考手册系列 网址: http://css.doyoe.com/

  6. 支付宝前端团队整理的《Web 前端开发入门手册》

    [回复"1024",送你一个特别推送] 今天是元宵节,首先祝大家元宵节快乐.但是,我万万没想到的是,一个元宵节现在都能成为我们程序猿的节日,名曰:猿宵节. 真的是越来越佩服我们程序 ...

  7. 支付宝前端推出《Web前端开发入门手册》

    web前端教程 用大白话,来讲编程 近日,支付宝前端团队写的<Web前端开发入门手册>对外公开了,原本是用于内部培训使用,现在对外公开了. 这本手册是初学者的福音,它的受众群体是前端小白, ...

  8. 前端分离的前端开发工具_使我成为前端开发人员工作的工具和资源

    前端分离的前端开发工具 Learning front-end development can be a bit overwhelming at times. There are so many res ...

  9. 前端开发环境搭建(工具使用)

    迅雷 用于之后下载一些安装包,速度较快 命令行工具 shift + 鼠标右键:在此处打开powershell node + 文件名: 在node中执行文件 输入部分文件名 + Tab: 自动补全文件名 ...

最新文章

  1. 6月11号=》121页-125页
  2. web开发的一些心得
  3. 自己录制的Oracle 相关视频(陆续更新)
  4. 最近的生活[发点牢骚]
  5. 庆祝法国队夺冠:用Python放一场烟花秀
  6. Oracle SQL 内置函数大全
  7. DBA(四):数据读写分离,MySQL多实例操作
  8. vue 生命周期详解
  9. linux系统中/etc/syslog.conf文件解读
  10. LeetCode MySQL 1501. 可以放心投资的国家
  11. Linux系统编程12:进程入门之进程的优先级及PR和NI如何修改进程优先级
  12. 论文笔记之:Deep Reinforcement Learning with Double Q-learning
  13. 1.5 推荐优秀书籍 - 网站重构与Web标准设计 - 学习笔记
  14. math库是python语言的数学模块_Python入门-函数库(模块)
  15. c++ STL之unordered_map
  16. 使用StatSVN编译代码变更(未成功)
  17. 金融反欺诈-交易基础介绍
  18. Unity3D开发工具介绍
  19. 【Unity3D插件】AnyPortrait插件分享《(二)制作角色动画》
  20. 计算机管理中看不到iis,Win10系统找不到internet信息服务(IIS)管理器怎么办

热门文章

  1. Cisco PBR Case2
  2. 解决mysql Table ‘xxx’ is marked as crashed and should be repaired的问题。
  3. CXF 不依赖spring的实现
  4. asp Eval()函数的一些使用总结
  5. 译Selenium Python Bindings 6 - WebDriver API
  6. OpenCV中的reshape
  7. 超级烧脑惊悚悬疑电影《恐怖游轮》(原片+解说)
  8. Q142:PBRT-V3,交点处各种微分的求解(三角形,3.6章节)
  9. mt6765和骁龙665哪个好_华为都把骁龙850用在了自家的win10设备上了,麒麟还会远吗?...
  10. 企业如何从大数据系统中获益