12款帮助“召唤神龙”的前端开发工具

摘要: 本文整理12款优秀的前端开发工具,其中包含一些实用应用、Chrome扩展插件以及Mac上的应用,可以更加方便的帮助大家完成编程工作,提升web开发效果。

积攒12款前端开发工具,就可以召唤神龙了。在本文中,小编整理这些优秀的前端开发工具,分享了一些实用的应用、Chrome扩展插件以及Mac上的应用,相信会有你的‘菜’。

  1、Chrome dev tools   

enter image description here

  这是目前最好的前端开发工具!

  Chrome 自从它诞生后,就已经大量投资在开发者工具软体,至今仍不断的在改善它,每一个发布会都会伴随着它自己的全新开发功能。

  这个开发工具是一个完整的多元软体套件,你可以实时编辑 DOM(HTML)/CSS,当进行一个深入的效能分析时,可以一步步找出 Javascript 的错误,甚至能增加终端机指令。感谢有它,近来解决了回报效能的问题。

  DOM/CSS 编辑器是非常强大的工具,能即时回馈给你的团队,能够在 UI/UX 的新功能上很快地执行迴圈。

  2、Grunt   

enter image description here

  说到工作自动化,Grunt 是我们的首选。

  它是 Javascript 跑任务的专家,针对一般的任务提供大量整合性的外挂程式,扩展程度仍很高,提供很多选项让你能够自由的写任何符合需求的工作内容。最棒的是,你能够将这些任务结合创造更强大而复杂的工作。

  3、LiveReload   

enter image description here

  你有没有算过,每天平均有多少次会按键盘上的重新整理键呢?非常多,对吧!

  LiveReload 是一个简单的 Web 协议,不论档案在哪时候被修改而触发事件,客户都能自行处理事情;客户端和伺服器端都能进入各种不同的实作。

  说到 Chrome 的扩充功能,Chrome 商店就是一个很强大的例子。去体验看看吧,你一定能发现很多让生活变得更简单的东西。

  4、Karma   

enter image description here

  最后一个是 Karma,Karma(一个测试程式是否符合需求的测试工具)是 Javascript 的程式测试工具,由 AngularJS 的团队写的,现在你可以徜徉在 Mocha、Chai 和 Sinon 中写测试程式,何不同时用它们持续地测试、跑程式,给你实时的回馈呢?Karma 可以让你从你的工作站到持续整合制造(CI,Continuous Integration)执行你的测试,它能同时发布到多个浏览器(Chrome、Firefox、IE 和 PhantomJS 等等),除此之外,还能跑你的测试来挑战它们,给予你对你的程式码最大的信心。

  当然,我们甚至还没有提到任何文字编辑器,SublimeText 和 Vim 我们都有用,它们是我们生产力最最重要的基础。

  5、Awesome screenshot   

enter image description here

  一款chrome扩展插件。捕获整个页面或任何部分,可以滚动截取,矩形,圆形,箭头,线条和文字,模糊敏感信息,一键上传分享注释。支持PNG和链接。有免费版本和付费版本,适合与美工交流图片问题。

  网址:http://www.awesomescreenshot.com/

  6、Postman   

enter image description here

  一款chrome插件。快速测试你的API,支持get、post方式,自定义header;自定义变量,可以方便的切换开发环境;支持数据的导入导出。

  网址: https://www.getpostman.com/

  7、ngrok   

enter image description here

  一款将本地服务映射成网络服务的工具,支持Mac、Window、Linux等系统,是免费的。

  网址:https://ngrok.com/

  8、Moom   

enter image description here

  用Moom可以更好的完成Mac上的移动、缩放窗口工作,节省不少时间,仅支持Mac。是收费的。

  网址:https://manytricks.com/moom/

  9、PicGIF Lite   

enter image description here

  Mac上的应用,免费。可以将图片和短视频生成gif格式。

  mac app store: https://itunes.apple.com/us/app/picgif-lite/id844918735?mt=12

  10、初页

enter image description here

  云起初页官网。可免费下载安卓版和苹果版初页App,或通过电脑在线创建、编辑,轻松创作优雅、炫酷,利于微信传播的H5海报。非常适合用于微信H5海报创作。

  官网:http://chuye.cloud7.com.cn/

  11、Dash   

enter image description here

  提供Mac上超过150+的离线API文档,更新及时。

  网址:https://kapeli.com/dash

  12、Charles   

enter image description here

  是一款HTTP代理/HTTP监测/反向代理加速的软件。能够让开发者查看所有网络和机器之间的HTTP流量情况。包括请求、响应、HTTP头信息(包含cookies和缓存)等。

  Charles 是免费的,支持Mac,Windows,Linux.

  网址:http://www.charlesproxy.com/

  在做开发的过程中,最真实的快乐就是又快又好的开发出自己想要的东西,这是一种实时的成就感。如果你成为一名优秀的前端工程师,那么你会在这些工具里找到很多东西,帮助你全面掌控提高开发效率。

  现在你已经非常有能力成为前端的忍者,在你的开发旅途中已经准备好要迎接每个挑战了。但如果您刚好是一名前端工程师,也欢迎您在下面和大家分享喜欢的工具。

注:此文章仅代表个人观点,若不认同,请忽略。

原文链接:http://www.html5cn.org/article-8999-1.html

本站文章均由 HTML5梦工场 编辑从其他媒体精选HTML5相关文章转载,仅供网友学习和交流,如果我们的工作有侵犯到您的权益,请及时联系小编QQ:123464386,我们会在第一时间进行处理!