如何学web前端，选择一个好用便捷的开发工具，能够大大的提高我们的开发效率。web前端开发建议使用VScode和HbuilderX，它们强大的代码助手能够帮助你快速完成开发，还有各种方便的快捷键以及强大的插件扩展。
易牛云朗沃给大伙推荐一些VScode常用插件：
一、会了吧。没错名字就是“会了吧”，打开源码可以自动分析源码中所有包含的英语单词，并显示解释结果，先学单词再看代码。用了会了吧，统统都会啦！ 对于英语不怎么好，在学习途中的小伙伴非常友好，很有帮助。
二、文件图标 vscode-icons。为了使我们在开发时有一个清晰的界面，我们需要对一些组件做一些美化。vscode-icons 插件可以实现对各种文件类型的文件前的图标进行优化显示，这样我们在查看繁杂多样的文件列表的时候，不用直接去看文件的后缀名，可以直接通过文件的图标就能够知道文件的类型。
三、代码检查工具 ESLint。ESLint 是一个对语法规则和代码风格的检查工具，可以用来保证写出正确的语法并且统一风格的代码。VSCode 中的ESLint插件就直接将ESLint 的功能集成好，安装后即可使用，对于代码格式与规范的细节还可以自定义，并且开发团队可以共享同一个配置文件，这样团队的所有人写出的代码就可以使用同一个代码规范，在代码签入前每个人都可以完成自己的代码规范检查。
四、arrr。这是一款前端开发非常实用的插件，他能够把html代码提取成为一个组件，我们在开发过程中，有很多代码是共用的，例如header、footer，那么就没有必要每个页面都去重复写html，造成大量的代码冗余。使用时只需要选中需要提取成组件的代码部分，能够快速的生成一个组件，并完成导入部分的代码。
除此之外，还有各种各样提升开发效率的插件，在此就不一一展示了。Visual Studio Code (简称 VS Code / VSC) 支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义快捷键、括号匹配和颜色区分、代码片段、代码对比 Diff、GIT命令 等特性，支持插件扩展，并针对网页开发和云端应用开发做了优化。软件跨平台支持 Win、Mac 以及 Linux，运行流畅，可以说是微软的良心之作。
