一直觉得前端开发缺个手册,这是个体力活。不过总得有人来干。
今天闲来无事,把一些工具(online和client的)、常用网址、以及经验总结等罗列出来和大家分享下。
国外CSS酷站欣赏
forcss.Com
http://www.forcss.com
http://www.urbantrash.net/cssgallery/
http://www.csselite.com/
http://www.cssheroes.com/
在线工具集
常用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满天飞的时代,我还是推荐这种方案,因为只有神奇的原装IE
6,才能抵挡运营神奇的问题。另外如果还有其他机器可供支配的话,建议再装个IE 8 + IE Tester,因为IE 8下的Developer
Toolbar还是有很大改进的,调试起来会方便一些。
以下三个软件相对不重要些:
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
维基百科
分享到:
相关推荐
【互联网行业】前端工程师详解前端开发人员的职业规划和自身定位 前端开发是互联网行业中不可或缺的一部分,虽然有时会面临挑战,但其未来发展前景广阔。对于前端开发者来说,理解职业规划和自身定位至关重要。 ...
本文将深入探讨“前端开发人员开发环境”,一个涵盖了前端开发所需所有常见工具的一站式解决方案。 首先,我们需要理解“安装环境”这个标签所指的内容。在前端开发中,安装环境通常涉及以下部分: 1. **操作系统*...
前端开发是互联网技术的重要组成部分,主要涉及网页设计和网站应用开发。前端开发者需要精通Web技术,包括HTML、CSS、DOM和JavaScript等,来设计和实现用户界面和用户交互部分。该手册详细介绍了前端开发实践、学习...
"前端开发人员,css样式取色器"是一个专为前端工程师设计的实用工具,它提供了简单易用的界面和高效的功能,如点击放大取色、右键取消以及自动保存和复制颜色值。 首先,取色器的点击放大功能允许开发者精确选取...
"google浏览器插件 web开发人员常用工具"这个压缩包正是针对这一需求而准备的资源,包含了firebuglite和web developer等知名开发工具的安装文件,旨在帮助开发者更好地进行网页调试和优化。 首先,我们来了解一下...
理解并熟练掌握这类工具的使用,对于前端开发人员来说,不仅可以提升个人技能,也有助于团队协作和项目的成功实施。在不断发展的技术环境中,持续探索和利用这些工具,将使开发者保持与时俱进,更好地应对各种挑战。
总结,《前端开发人员手册2017版》是一本全面覆盖2017年前端开发生态的宝典,从基础到高级,从工具到实践,为开发者提供了丰富的学习资源和实战指导。无论你是刚入门的新手还是希望更新知识的老兵,都能从中受益。...
总的来说,WeFlow是一个强大且全面的前端开发工具,它整合了前端开发所需的各项功能,如构建、打包、实时更新和代码质量检查。通过使用WeFlow,开发者可以更专注于编写高质量的代码,提高开发效率,减少因配置和兼容...
用于前端开发人员编写html时取色使用,可以快速选取自己想要的颜色对应的编码
随着互联网行业的持续发展,对前端开发人员的需求不断增加。前端开发的待遇通常与技能水平成正比,经验丰富的开发者往往能得到更高的薪资。常见的前端职位包括网页/网站开发工程师,这些岗位不仅要求掌握HTML、CSS和...
需要注意的是,虽然这款工具名为"前端开发人员取色器",但其实颜色选取工具同样适用于UI/UX设计师、图形艺术家和其他需要在屏幕上精确选取颜色的行业专业人士。对于前端开发者来说,结合使用这类工具和CSS预处理器...
在前端开发过程中,精准的布局和尺寸控制是至关重要的,特别是在构建响应式网站或需要精确像素对齐的设计时。"前端专用刻度尺.zip" 提供了一种实用的解决方案,帮助开发者更方便地进行视觉调整和尺寸测量。这个压缩...
本文旨在深入探讨IE8开发人员工具的各项功能与使用技巧,帮助前端开发者更好地理解和利用这一工具,提升网页开发与调试效率。 #### 二、开发人员工具概述 开发人员工具,又称为开发者工具或调试工具,是专为前端...
"前端开发素材图片测量工具"就是针对这一需求的专业软件,帮助开发者准确地获取和调整图片的像素尺寸。 首先,我们来看“像素大厨软件测量psd”。像素大厨是一款专为前端开发者和设计师设计的PSD测量工具,它可以...
- Firefox 插件 Firebug:Firebug是HTML、CSS和JavaScript调试的利器,它允许开发者直接在浏览器中查看和修改页面元素,调试JavaScript代码,对前端开发人员来说是不可或缺的工具。 - Web Developer Toolbar:这款...
前端开发人员通常是团队中的桥梁,需要与设计师、产品经理、后端开发人员紧密合作,实现产品的需求。因此,良好的沟通技巧和团队协作能力对于实习生来说至关重要。 最后,前端开发工程师在职业生涯中需要不断适应...
IE开发人员工具 F12调试工具 就是为前端开发人员开发页面而设计的工具 提供一系列的小工具 让你可以方便的查找 调试页面的BUG 包括HTML代码 CSS代码和JavaScript代码 同时 他也提供了一些虽然比较鸡肋 但是还能...
- Dreamweaver:是Adobe公司开发的一款专业级网页设计软件,集代码编辑、视觉化编辑、预览等功能于一体,非常适合前端开发人员使用。 - HBuilder:一款为Web前端开发打造的轻量级编辑器,支持多语言语法高亮显示,...
"前端开发人员所需的所有工具和技术"这个压缩包文件,可能包含了各种帮助前端开发者提升效率、优化工作流程的资源。下面,我们将详细探讨这些工具和技术。 首先,前端开发的核心技术包括HTML、CSS和JavaScript。...
标题中的“GPT-4可以帮助前端开发人员快速实现编写代码”揭示了主要知识点,即GPT-4在前端开发中的应用。GPT-4是OpenAI的预训练语言模型,其目的是通过理解和生成自然语言来协助人类进行各种任务。在这个场景下,它...