前端开发必备工具

内容简介：前端开发必备工具

前端开发QQ群： 328058344 ，禁止闲聊，非喜勿进~！

开发的过程中经常会使用到的各种辅助软件，学会并灵活的使用这些工具，可以提高开发效率，提高排查问题的速度，达到一个事半功倍的效果；

这里我就列出在开发的过程中我会使用的一些工具，分享给大家。

抓包神器

WEB API 开发和调试，线上问题排查，总是需要有抓包 工具 进行请求的抓包分析

如：手机APP，PC 软件，浏览器和WEB API 交互请求的抓包

• 常用功能
  • 模拟请求，get，post 等
  • 获取请求报文，响应报文，分析报文
  • 编辑请求报文(请求参数，请求头，cookie 等)，重新发起请求
  • 请求断点，编辑请求头，或者响应内容 等
  • 并发请求测试
  • 请求响应时间分析
  • … …

以下是我经常会使用到的几个抓包神器,具体的使用看【使用教程】， 我这里就分享下我在使用工具上的心得

Fiddler

使用教程

Fiddler 是我最早开始使用的抓包器，完全免费，把报文的解析成不同的数据模块通过切换可以很清晰的找到自己想要数据， 而且可以很方便的修改请求头数据，上传的参数，cookie，编辑完成后还可以重新发起请求；

• 优点：
  • 完全免费
  • 支持手机端代理抓包
  • 支持https抓包
  • http 报文解析成对应的数据模块，结构清晰查找方便
• 缺点
  • Fiddler 是基于微软 .Net 技术开发的，没办法直接在 Mac/Linux 下使用
  • host解析修改后需要重新启动，不然解析无法生效

Charles

使用教程

• 优点：
  • Fiddler的优点 Charles基本都有
  • 支持Mac/Linux
  • Charles抓包到的请求根据域名分类展示，这点我很喜欢，很方便查看
  • 可以发起并发请求
• 缺点
  • 收费，免费的有限制

Wireshark

使用教程

这个抓包工具功能比较强大，除了可以抓 http协议还可以抓如：TCP 等 各种协议的请求， 我一般在抓程序发起TCP连接操作Redis，mongodb的时候会使用，看看代码在实际的协议中触发的操作命令是什么。

HOST解析工具

SwitchHosts

官方入口

域名host解析必备神器，支持 windows和Mac的开源工具， 使用简单，支持自定义分类配置，可切换配置，合并配置。

轻量级文本编辑器

Sublime

轻量级文本编辑器，各种使用技巧，前端开发神器，各种插件欲罢不能，如：Emmet 等

Visual Studio Code

微软开源轻量级文本编辑器后起之秀，据说打开大文本文件速度很快，也是支持各种插件，官方提供中文版， 对于：nodejs，typescript 等开发也都有很好的支持，有一种要取代sublime的“感脚”

翻墙神器

Lantern

Lantern 中文简称“蓝灯”，免费翻墙工具，翻墙后就可以通过google查询开发资料对于开发者来说这个还是很有必要的，同时也是宅男必备神器╮(‵▽′)╭ 此处省略一万字，自行脑补画面

浏览器调试工具

打开浏览器F12就会启动调试工具，不同内核浏览器集成不一样的开发者工具

• [推荐] 谷歌开发者调试工具
  • 可切换手机模式
  • 设置网络状况,2G，3G，4G，wifi 等
  • 请求抓包
  • html查看，编辑
  • css查看，编辑
  • cookie，本地数据等查看，编辑
  • js断点debug
  • 控制台警告，错误提示，调试js
  • 性能分析
  • 谷歌开发者工具是英文版，刚开始使用会比较不习惯，用多了就习惯了
  • 等
• 火狐的Firebug
  • 与谷歌开发者工具基本功能差不多
  • 火狐Firebug是中文容易上手
• IE开发者调试工具
  • 基本功能大同小异

必备浏览器插件

• JSONView
• Postman 支持发各种请求发送，支持自定义类目保存请求云同步，自定义脚本

大家还有啥推荐的留言分享吧~

前端开发QQ群： 328058344 ，禁止闲聊，非喜勿进~！

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

• 2019“寒冬”前端面试必备（持续更新...）
• 前端进阶必备 — 手撕排序算法
• 前端高效开发必备的 js 库梳理
• 前端开发者必备的Nginx知识
• 前端开发者必备的 Nginx 知识
• 前端工程师必备的Web安全知识

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。