提升前端效率的十款工具(上篇)

简介: 推荐十款体验极好的十款前端工具, 善用它们, 让你偷懒的同时, 快速把活儿赶完, 早点下班~快速开启一个http服务可以通过npm全局安装一个http-server,当需要开启服务的时候, 通过命令行,跳转到需要开启服务的文件夹下, 开启服务即...

推荐十款体验极好的十款前端工具, 善用它们, 让你偷懒的同时, 快速把活儿赶完, 早点下班~

快速开启一个http服务

可以通过npm全局安装一个http-server,当需要开启服务的时候, 通过命令行,跳转到需要开启服务的文件夹下, 开启服务即可!

  • 安装http-server: sudo npm install --global http-server
  • 开启服务并打开浏览器(会默认自动打开目录下的http文件): hs -o

优雅查看Json数据

json-formatter是一款自动格式化json数据的插件, 方便我们快速查看接口返回的json数据, json-formatter同时也是一款辅助写爬虫的利器
json-formatter下载地址


格式化前:

格式化后:

安装完成后, 可以用斗鱼接口返回的数据查看一下效果: https://www.douyu.com/gapi/rkc/directory/2_201/1

本地模拟数据接口

项目开发阶段, 前端程序员有时候会面临无数据接口可用的窘境, 这时候可以使用Charles和一个json文件, 在本地任意端口开启一个api服务, 提供测试数据

详情请看Charles"傻瓜式"创建测试接口

快速标注图片

标注图片这种事情应该交给UI设计师来做, 但如果UI不在家, 项目进度赶得紧, 你只能自己来了, 马克鳗是一歀设计稿标注工具, 用户使用体验很好, 学习成本极低, 非常适合懒人使用, 如果你像我一样懒, 推荐使用马克鳗~



详情请看: 马克鳗治好了我多年的像素眼

为图片瘦身

  • 为了节省服务器流量, 提升网页的打开速度, 我们需要对网页图片进行瘦身, PP鸭是一款很好用的图片压缩工具, 没有任何参数设置, 软件会自动寻找 品质, 体积, 与速度的平衡点, 将图片尺寸进行调优, 支持gif, png, gif三种格式, 操作超级简单
目录
相关文章
|
2月前
|
前端开发
Github项目分享——免费的画图工具drow,最新前端面试题整理
Github项目分享——免费的画图工具drow,最新前端面试题整理
|
1天前
|
前端开发 JavaScript 开发工具
前端开发最佳实践与工具推荐
【7月更文挑战第22天】前端开发是一个充满挑战和机遇的领域,掌握最佳实践和高效工具是提升开发效率、保证项目质量的关键。通过遵循版本控制、构建和部署、编写高质量代码、性能优化和安全性等最佳实践,并结合代码编辑工具、版本控制工具、包管理工具、构建工具、调试工具等实用工具,我们可以更好地完成前端开发任务,提升个人和团队的竞争力。
|
21天前
|
前端开发 JavaScript
前端模拟接口工具推荐——Apifox(mock数据)【图解教程】
前端模拟接口工具推荐——Apifox(mock数据)【图解教程】
149 1
|
23天前
|
Web App开发 缓存 前端开发
前端性能优化技巧与工具
【6月更文挑战第30天】前端性能优化旨在提升Web应用速度和响应性,关乎用户体验、转化率及SEO。关键技巧包括减少HTTP请求、压缩资源、利用缓存、异步加载和优化DOM操作。工具如Lighthouse、PageSpeed Insights、Webpack Bundle Analyzer及Chrome DevTools提供性能分析和优化建议。优化是持续的过程,适应复杂Web需求。
|
28天前
|
移动开发 前端开发 JavaScript
前端学习加速器:高效软件工具与实用设置攻略
前端学习加速器:高效软件工具与实用设置攻略
前端学习加速器:高效软件工具与实用设置攻略
|
28天前
|
存储 JavaScript 前端开发
vue 快速入门+vite前端构建工具
vue 快速入门+vite前端构建工具
35 0
|
1月前
|
Web App开发 前端开发 网络协议
性能工具之常见压力工具是否能模拟前端
【6月更文挑战7天】性能工具之常见压力工具是否能模拟前端
20 0
|
2月前
|
资源调度 JavaScript 前端开发
Vite:下一代前端构建工具的快速上手
Vite 是由 Vue.js 的作者尤雨溪开发的下一代前端构建工具,它以其快速的冷启动、按需编译和热更新能力而受到广泛关注。Vite 通过利用浏览器原生的 ES 模块导入功能,提供了几乎即时的开发环境启动速度和高度优化的开发体验。
54 2
|
2月前
|
缓存 前端开发 JavaScript
如何优化前端性能:最佳实践与工具推荐
在当今互联网时代,用户对网页加载速度和性能的要求越来越高。本文将介绍一些优化前端性能的最佳实践,包括代码压缩、资源合并、懒加载等技术,并推荐一些实用的工具,帮助开发者提升网页加载速度和用户体验。
|
2月前
|
前端开发 持续交付 开发工具
【专栏:工具与技巧篇】版本控制与Git在前端开发中的应用
【4月更文挑战第30天】Git是前端开发中的必备工具,它通过分布式版本控制管理代码历史,支持分支、合并、回滚等操作,促进团队协作和冲突解决。在前端项目中,Git用于代码追踪、代码审查、持续集成与部署,提升效率和质量。优化协作包括制定分支策略、编写清晰提交信息、定期合并清理分支及使用Git钩子和自动化工具。掌握Git能有效提升开发效率和代码质量。