前端开发工作流
pfan123 opened this issue · 0 comments
pfan123 commented
前端开发工作流
工具
文档工具
- Typora
- Quiver
- Tick Tick
流程设计工具
- MindNode
- OmniGraffle
- XMind
- Sketch
- Flowkit - 用Sketch定制你的流程图
- Craft - 辅助改变设计流程
- sketch-dev-tools
- Sketchpacks
- Xnip - 截图工具
- Gifox - GIF 动画制作工具
- animockup - Create animated mockups in your browser and export as video or animated GIF
🔥 - unscreen - Remove Video Background
开发工具
- node
- 管理工具
- n 版本管理
- nrm NPM 镜像源管理
- mrm 快速生成项目配置文件
- http-server 命令行 http 服务器
- nodemon 文件变更自动重载服务
- web相关模块
- 性能工具
- autocannon node编写的压测工具
- wrk HTTP基准测试工具
- loadtest HTTP或WebSockets 运行负载测试
- siege Siege是一个开源回归测试和基准测试实用工具。
- appmetrics-dash Node应用指标监控看板
- spy-debugger 一站式页面调试、抓包工具
- 管理工具
- git
- commitizen(提交提示) + husky + lint-staged + @commitlint/{cli,config-conventional}
- commitizen/cz-conventional-changelog + conventional-changelog/standard-version
- Homebrew
- Docker
- Kubernetes
- sourcetree - 分支管理工具
- Robo 3T
- Pngyu - 图片压缩处理
- Medis
- iTerm + oh-my-zsh + oh-my-plugins
- plugins: git + autojump + zsh-autosuggestions + zsh-syntax-highlighting
- Visual Studio Code
- Prettier - Code formatter - 超人气代码格式化工具prettier
- HTML Snippets - 超级实用且初级的 H5代码片段以及提示
- HTML CSS Support - 让 html 标签上写 class 智能提示当前项目所支持的样式,新版已经支持 scss 文件检索
- Debugger for Chrome - vscode 映射 chrome 的 debug功能,静态页面都可以用 vscode 来打断点调
- vscode-icon - vscode 资源树目录加上图标
- Path Intellisense - 路径自动补全
- Npm Intellisense - require 时的包提示
- Document this - JS 注释模板
- ESlint - JS 代码规则检测
- TSLint - ts 代码规则检测
- Project Manager - 多个项目之前快速切换的工具
- beautify - 格式化代码的工具
- GitLens - 实时查看代码版本记录
- fileheader - 顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间
- filesize - 在底部状态栏显示当前文件大小,点击后还可以看到详细创建、修改时间
- code-spell-checker - 检查单词拼写
- Vetur - Vue tooling for VS Code
- EditorConfig for VS Code - 统一编码缩进风格
- draw.io - 流程图工具
- VSCode Docker - 方便管理和部署容器化应用程序
- Comment Translate - 注释翻译
- VuePress - 快速生成 markdown 文档
其他常用工具
- The Unarchiver