超硬核 Web 前端学霸笔记，学完就去找工作！

文章和教程

• Vue 学习笔记
• Node 学习笔记
• React 学习笔记
• Angular 学习笔记
• RequireJS 学习笔记
• Webpack 学习笔记
• Gulp 学习笔记
• Python 学习笔记
• Egret 引擎学习笔记
• 流处理，TCP 和 UDP，WebRTC 和 Blob 学习笔记

博客

• 前端回忆录 | 前端笔记本 - 一个前端博主记录的心得和总结
• Hasnode - Hashnode 是在您的个人域 free 上免费创建开发者博客并通过我们的全球开发者社区与读者联系的最简单方法！ 👩‍💻👨‍💻
• Dev.to - DEV 是一个由软件开发人员组成的社区，他们聚在一起互相帮助。
• Hackernoon - 一个独立的技术媒体网站

必须具有 Chrome 扩展程序

• DailyDev - 在 Chrome 默认标签中获取有关 Dev 社区的最新消息。
• WhatFont - 了解网站使用的是哪种字体。
• ColorPick Eyedropper - 只需放下笔，即可知道网站使用的是哪种颜色。
• Wappalyzer - 了解任何网站的技术栈
• Web Developer - 该扩展程序拥有大量工具。
• React Developer Tools - React 开发者工具是 Chrome DevTools 扩展，用于开源 React JavaScript 库。它使您可以检查 Chrome 开发者工具中的 React 组件层次结构。

---

前端性能分析工具

• PageSpeed Insights - PageSpeed Insights 能够针对移动设备和桌面设备生成网页的实际性能报告，并能够提供关于如何改进相应网页的建议。
• Lighthouse - Lighthouse 是一个开源的自动化工具，用于改进网络应用的质量。 您可以将其作为一个 Chrome 扩展程序运行，或从命令行运行。 您为 Lighthouse 提供一个您要审查的网址，它将针对此页面运行一连串的测试，然后生成一个有关页面性能的报告。
• Pingdom - 在线网站速度检测工具是由一家网站监测服务公司推出的网页速度检测工具，帮助用户找出影响网站速度的原因，并给出改善网页性能的可行性方案，对于有网站的用户来说非常实用。
• Sitespeed.io - Sitespeed.io 是一款开源的 Web 性能测试工具，用来衡量 Web 网站的综合性能，帮助开发和测试人员分析网页的加载速度和渲染性能。
• Calibre - Caliber 是一款多功能的性能监控套件，可帮助你监控和审核网站的性能。 它还允许你通过指定测试服务器的位置，管理模拟的广告首选项甚至模拟移动设备来模拟现实条件。 它还允许你设置预算，并通过为你提供性能下降来帮助你将预算保持在预算之内。
• SpeedTracker - SpeedTracker 是一个运行在 WebPageTest 之上的工具，可在你的网站上进行定期的性能测试，并直观显示各种性能指标随时间变化的方式。 这使你可以不断评估网站，并查看新功能如何影响网站的性能。 你还可以定义预算并通过电子邮件和 Slack 获取警报。

VS 代码必须具有扩展名

• Compile Hero - Compile Hero 是一款简单易上手用于一键编译 Less, Sass, Scss, Styl, TS, TSX, Jade, Pug 或 JS 等文件的编辑器工具。
• NPM - 此扩展名可帮助您管理 Package.json 并在未安装依赖项时提供警告，也会有所帮助与版本控制。
• Prettier - Prettier 是一种自以为是的代码格式化程序。它通过解析代码并使用自己的规则（考虑最大行长）重新打印代码，从而实现一致的样式，并在必要时包装代码。
• 彩虹括号 - 通过对环境中设置的每个支架进行颜色编码，可以轻松找到丢失的标签。
• VS 代码大图标 - 通过应用适当的图标集来按类型直观地识别文件，从而组织环境。