Web学习笔记之：web相关开发工具以及使用心得与技巧

写在前面

工欲善其事，必先利其器。好的开发和调试工具不仅会让你少走弯路，更会引导你养成良好的开发习惯和开发思维。那么，在我学习web开发的过程中用到了哪些工具，这些工具有什么技巧和使用体会呢？
我们一起来看看吧！

前端代码与调试：Atom

Atom 是 Github 专门为程序员推出的一个跨平台文本编辑器。具有简洁和直观的图形用户界面，并有很多有趣的特点：支持CSS，HTML，JavaScript等网页编程语言。它支持宏，自动完成分屏功能，集成了文件管理器。

个人感受：
1. Atom软件本身相当于是用electron编写的，界面时髦，功能也比较丰富，至于稳定性：我使用了大概两个多月，没有发现异常崩溃的现象。
（这里扩展一下，其实Atom 就是electron的爸爸，最初是 Github 发布的 Atom 编辑器衍生出的 Atom Shell，后更名为 Electron。)
2.Atom具备丰富的插件安装功能。想要代码补全？插件有！想要HTML实时预览？插件有！而且依托于GitHub，不断有开源爱好者和软件开发者开发出优秀的插件来，生态还是十分良性的。

使用技巧：
这里说几个个人使用的技巧

1.插件安装：

这是我安装的插件，解释在图中有的。
注意其中的atom-html-preview，推荐安装这个，这是atom实时预览html插件做的比较优秀的。
(为了找好插件，翻了好多论坛和帖子)

2.拖拽打开：
atom 各种web的文件都是比较顺利的，直接向atom里面拖拽就好了，而且代码高亮处理的不错。

专业搜索工具：Archivarius 3000

又到了我核弹库里的杀手级软件了：Archivarius 3000！这也是我们的老朋友了。
　
Archivarius 3000是一款功能非常强大的电脑文件搜索软件，它搜索范围广，可帮助用户快速搜索包含局域网在内的指定文件，同时还有创建、删除、重建、更改、压缩、计划任务等多种常见功能。它提供的全文本文档搜索现在可以支持10种不同的语言。程序将会提取和保存关于文档的完整信息，既使文档实际上并不能够访问，Archivarius 3000将会通过关键字查找它们，并检查文件位于哪个磁盘中。
程序几乎支持所有普通的文档类型，从MS Office、PDF到TXT。它可以在压缩文档和Outlook，Outlook Express和The Bat的电子邮件及邮件附件中进行搜索。

这两段话看完，你找到Archivarius 3000最大的亮点了吗？

对！这神仙东西居然可以搜索到文件里面的内容，而不只是文件名！
我举个例子：
我们可能会发生这样的事：你写了一份稿件，但是却忘了文件名，也忘记存在哪里了，只记得你稿件里面写的一句话。
这时候像everything这样的文件搜索工具基本上就无能为力了，但Archivarius 3000可以。
下图为Archivarius 3000在一整个文件夹里检索指定文本内容的例子。

这东西的作用不用我说了吧，简直不要太方便！
在查找代码调用的时候，直接把整个工程丢进去建立索引，然后直接查方法名！

（我之前就是全程使用Archivarius 3000 来对arduino的启动和调用流程进行分析的，少了他，我几乎不可能从近千个.c和.h文件中找到我想要的代码片段，尽管使用VS也可能可以，但Archivarius 3000 来的更加简单专业，并且文件类型更加全面！PS:你试过把整个盘符作为工程丢进VS吗哈哈）

网络抓包工具：Wireshark

Wireshark（前称Ethereal）是一个网络封包分析软件。网络封包分析软件的功能是撷取网络封包，并尽可能显示出最为详细的网络封包资料。Wireshark使用WinPCAP作为接口，直接与网卡进行数据报文交换。

在过去，网络封包分析软件是非常昂贵的，或是专门属于盈利用的软件。Ethereal的出现改变了这一切。在GNUGPL通用许可证的保障范围底下，使用者可以以免费的代价取得软件与其源代码，并拥有针对其源代码修改及客制化的权利。Ethereal是全世界最广泛的网络封包分析软件之一。

网络管理员使用Wireshark来检测网络问题，网络安全工程师使用Wireshark来检查资讯安全相关问题，开发者使用Wireshark来为新的通讯协定除错，普通使用者使用Wireshark来学习网络协定的相关知识。
当然，有的人也会“居心叵测”的用它来寻找一些敏感信息……

笔者曾经接手过一个奇怪的需求：实验室里有一套门禁系统，使用的是专门的管理软件，里面有一个功能是强制开门几秒种，正好对应的就是刷卡开门的动作。
实验室希望有访客来访问的时候能在电脑上操作一下就远程把门打开，然鹅厂家拒绝透露接口。于是我就自己动手，用这个工具抓到门禁与管理软件的通信协议流程，然后使用python复现了出来，嘿嘿~
wireshark对于调比较底层的通信问题很有用，所以在这里也做了说明，web开发者也许更喜欢用下面的工具。

网页调试工具：postman

postman是一款强大网页调试工具的客户端，postman为用户提供强大的 Web API & HTTP 请求调试功能。
postman能够发送任何类型的HTTP 请求 (GET, HEAD, POST, PUT…)，附带任何数量的参数+ headers，是一款非常实用的调试工具。

postman软件特色：
支持各种的请求类型： get、post、put、patch、delete 等
支持在线存储数据，通过账号就可以进行迁移数据
很方便的支持请求 header 和请求参数的设置
支持不同的认证机制，包括 Basic Auth，Digest Auth，OAuth 1.0，OAuth 2.0 等
响应数据是自动按照语法格式高亮的，包括 HTML，JSON 和 XML

postman软件功能
1、模拟各种HTTPrequests
从常用的GET、POST到RESTful的PUT、DELETE…等等。甚至还可以发送文件、送出额外的header。
2、Collection功能（测试集合）
通过collection的归类，我们可以良好的分类测试软件所提供的API.而且Collection还可以Import或是Share出来，让团队里面的所有人共享你建立起来的Collection。
3、人性化的Response整理
一般在用其他工具来测试的时候，response的内容通常都是纯文字的raw，但如果是JSON，就是塞成一整行的JSON。这会造成阅读的障碍，而Postman可以针对response内容的格式自动美化。JSON、XML或是HTML都会整理成我们可以阅读的格式
4、内置测试脚本语言
支持编写测试脚本，可以快速的检查request的结果，并返回测试结果
5、设定变量与环境
Postman可以自由设定变量与Environment，一般我们在编辑request，校验response的时候，总会需要重复输入某些字符，比如url，允许我们设定变量来保存这些值。并且把变量保存在不同的环境中。

这个工具网上的教程和说明简直太多了，用的人也是多如牛毛，一句话，我强烈推荐！
————————————————————————————————————————
END
欢迎大家关注，点赞哦，您的支持是我加速更新和为您写出更好文章的动力！