如何学web前端(开发工具)

朗沃教育 - 专注于成都Web前端培训、成都Java培训 - 9.9元预科课程

 

如何学web前端,选择一个好用便捷的开发工具,能够大大的提高我们的开发效率。web前端开发建议使用VScode和HbuilderX,它们强大的代码助手能够帮助你快速完成开发,还有各种方便的快捷键以及强大的插件扩展。

VScode常用插件:

如何学web前端

如何学web前端

一、会了吧。没错名字就是“会了吧”,打开源码可以自动分析源码中所有包含的英语单词,并显示解释结果,先学单词再看代码。用了会了吧,统统都会啦! 对于英语不怎么好,在学习途中的小伙伴非常友好,很有帮助。

如何学web前端

如何学web前端

二、文件图标 vscode-icons。为了使我们在开发时有一个清晰的界面,我们需要对一些组件做一些美化。vscode-icons 插件可以实现对各种文件类型的文件前的图标进行优化显示,这样我们在查看繁杂多样的文件列表的时候,不用直接去看文件的后缀名,可以直接通过文件的图标就能够知道文件的类型。

如何学web前端

如何学web前端

三、代码检查工具 ESLint。ESLint 是一个对语法规则和代码风格的检查工具,可以用来保证写出正确的语法并且统一风格的代码。VSCode 中的ESLint插件就直接将ESLint 的功能集成好,安装后即可使用,对于代码格式与规范的细节还可以自定义,并且开发团队可以共享同一个配置文件,这样团队的所有人写出的代码就可以使用同一个代码规范,在代码签入前每个人都可以完成自己的代码规范检查。

四、arrr。这是一款前端开发非常实用的插件,他能够把html代码提取成为一个组件,我们在开发过程中,有很多代码是共用的,例如header、footer,那么就没有必要每个页面都去重复写html,造成大量的代码冗余。使用时只需要选中需要提取成组件的代码部分,能够快速的生成一个组件,并完成导入部分的代码。

除此之外,还有各种各样提升开发效率的插件,在此就不一一展示了。Visual Studio Code (简称 VS Code / VSC) 支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义快捷键、括号匹配和颜色区分、代码片段、代码对比 Diff、GIT命令 等特性,支持插件扩展,并针对网页开发和云端应用开发做了优化。软件跨平台支持 Win、Mac 以及 Linux,运行流畅,可以说是微软的良心之作。

 

朗沃教育 - 专注于成都Web前端培训、成都Java培训、成都IT培训

文章来自:成都朗沃教育  原创文章,转载请注明出处!

文章标题:如何学web前端(开发工具)

永久链接:https://www.lovoedu.com/itnews/web/4903.html

咨询课程 免费获取资料 联系老师