6

前端开发是创建 Web 页面或移动端等前端界面呈现给用户的过程，需要通过 HTML，CSS，J...

 4 years ago
source link: http://www.chanpin100.com/article/113215
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

【干货】不容错过！前端工程师必备的10款优质工具

阅读549

今天就为大家介绍10款优秀的前端开发工具，学会使用这些工具，不仅能提高开发效率，还能更清晰地将自己的研发思路呈现出来。

前端开发是创建 Web 页面或移动端等前端界面呈现给用户的过程，需要通过 HTML，CSS，JavaScript 以及衍生出来的各种技术、框架和解决方案，来实现互联网产品的用户界面交互。市面上有许多不同类型的前端开发工具，可以加速产品研发进程。今天就为大家介绍10款优秀的前端开发工具，学会使用这些工具，不仅能提高开发效率，还能更清晰地将自己的研发思路呈现出来。

1. 远程开发 - VSCode

VSCode 是目前最受开发人员欢迎的编码工具之一，具备强大便捷的远程开发能力。与其它远程开发工具不同的是，VScode 是通过 SSH(Secure Shell) 的方式连接到远程服务器。这种方式不仅省略了繁琐的上传和下载步骤，还可以实现实时同步，让远程开发过程更流畅高效。

collect_img16081082970706

功能特色：

开源工具，可免费使用

支持自定义配置

可集成Git

支持各种文件格式（html/jade/css/less/sass/xml）

调试功能强大

插件生态机制强大

2. 团队协作 - 摹客

在与产品和UI沟通的过程中，总是存在许多问题：产品逻辑不清晰、UI标注不准确、切图交付不及时等等。上述产品研发团队常见的协作问题，可通过摹客轻松解决。摹客是一款专为产品研发团队打造的设计协作平台，功能覆盖了从需求到开发的全部流程，打通了产品、设计、研发人员之间的沟通壁垒，可以轻松解决各式各样的协作难题，帮助开发工程师精准还原设计。

collect_img16081082975514

功能特色：

支持 PS/XD/Sketch/Figma 设计稿交付

可自由查看设计稿中的精准标注和图层标记信息

可自动生成样式代码，轻松复制使用

支持切图文件一键下载

支持自由切换平台和选择倍率

支持自动压缩和换算不同平台尺寸切图

3. 接口测试 - Postman

Postman 提供功能强大的 Web API 和 HTTP 请求调试，提供有 Chrome 扩展插件版和独立的APP，对于检查后端端点非常有用。

collect_img16081082979587

功能特色：

支持多种请求类型（get、post、put、patch、delete 等）

支持在线存储数据和迁移数据

支持请求 header 和请求参数的设置

支持不同的认证机制（Basic Auth，Digest Auth，OAuth 1.0，OAuth 2.0 等）

响应数据自动按照语法格式高亮，包括 HTML，JSON 和 XML

4.API在线文档生成和测试 - SwaggerUI

SwaggerUI 是一个 API 在线文档生成和测试的利器。有了这款工具，不需要频繁更新接口文档，就能保证接口文档与代码的一致。

collect_img16081082984145

功能特色：

支持在多种开发环境中使用

支持所有主流浏览器

完整的OAS支持

5.抓包工具 - Wireshark

Wireshark 是一款小巧、开源且能在几乎所有流行操作系统下使用的抓包工具软件。使用Wireshark 可以截取各种网络封包，显示网络封包的详细信息。可以在Windows和Mac OS上运行。

collect_img16081082987798

功能特色：

快速检测网络问题

快速检查信息安全相关问题

新通信协议调试

6.通用数据库管理 - DBeaver

DBeaver 是一个 SQL 客户端和数据库管理工具。由于 DBeaver 基于 Java 开发，可以运行在各种操作系统上，比如Windows、Linux、macOS 等操作系统。同时，DBeaver 采用 Eclipse 框架开发，支持插件扩展，并且提供了许多数据库管理工具：ER 图、数据导入/导出、数据库比较、模拟数据生成等。

collect_img16081082991849

功能特色：

通过 JDBC 连接到数据库，支持几乎所有的数据库产品

可以处理任何的外部数据源

7.MD编辑器 - Typora

Typora 是一款免费的轻量级Markdown编辑器，虽然没有 Mou，Haroopad等Markdown编辑器那么大名鼎鼎，但其轻量、快速、易于上手的特点，绝对能给你带来舒适的用户体验。

collect_img16081082995840

功能特色：

启动速度快

支持实时预览，所见即所得

界面简洁易操作

支持多拓展

8.虚拟机 - VirtualBox

VirtualBox 是一款免费的开源虚拟机，可以在Windows、Linux和mac等不同操作系统中运行。

collect_img16081083000474

功能特色：

开源软件，免费

安装配置简单实用，社区活跃

9.Git存储库托管 - GitHub

GitHub 是一个基于 Web 的 Git 存储库托管服务。无论你是软件开发的新手，还是已经具有丰富开发经验的老手，相信你在工作中都会需要这款工具。GitHub是目前世界上最大，最受欢迎的代码库，可以帮助开发人员审查代码，管理项目和软件构建。

collect_img16081083004669

功能特色：

极高的安全性

APP体积小

数据同步流畅无冲突

不限制私有仓库数量和流量

10.项目管理 - Trello

Trello 是一款灵活易用的项目管理工具，非常适合作为看板和 Scrum 开发，它易于管理，具有极高的可定制性。虽然不是专门为开发人员打造的工具，但Trello绝对可以帮助开发人员更好地完成工作。

collect_img16081083009143

功能特色：

更直观的资料与任务分类

更清晰的便利贴式任务呈现

操作便利，拖曳即可整理分类与管理进度

可以新增丰富的卡片内容

支持颜色标签、特殊印章

简单易懂、即时同步、多人管理

以上是小摹精心整理的10款前端开发工具，希望能帮助小伙伴们减轻工作量，做快乐的打工人！


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK