第一弹 开发环境搭建

踟躇了很久，终于痛下决心，搞一搞Web(苦笑...) 。网上的教程很多，但是能详细描述，顺利构建的很少，好多细节话不多说，搬砖~

一、下载VSCode和浏览器(本人学习Web用的是VS)

这里附上VSCode官网地址VSCode下载
浏览器推荐谷歌浏览器下载地址

二、VSCode使用概览

vsCode界面

1.资源管理器
用于新建、编辑、删除文件或文件夹等操作
2.搜索框
用于条件搜索
3.源代码管理
用于源代码管理程序注册
4、调试
用于调试程序
5、扩展/插件
管理插件
6、git
创建仓储管理

二、安装插件（以汉化插件为例）

插件安装

安装步骤：

1、点击扩展 进入安装插件界面
2、在应用商店搜索框中输入chinese
3、选取中文简体插件安装

推荐的2款插件

1、Live Server
2、open in browser

三、 设置文本自动保存

设置自动保存

如图。点击设置，选择setting后 显示上图界面 。在界面中输入auto save 默认是关闭状态 选择自动保存模式 设置时间范围

四、写出第一个自己的 hello world

操作步骤(三步一张图)：

1、点击资源管理器，新建文件
2、选中文件 右击另存为 选择文件夹目录 将文件存为.html格式
3、在文件中输入 ！然后 按tab 键 系统会自动生成一段代码 整体流程如下图所示

第一个helloWorld

接下来继续

1、将title 改为“第一个文件”
2、在body中插入<p>标签 文本写第一个hello world!
3、右键 选择open with Live Server

第一个 helloworld

执行效果 如下图

第一个helloworld

至此，大功告成！

五、总结

那么这篇文章我们学到了哪些知识？
1、开发环境的搭建和使用

2、插件的安装和使用
3、文件的创建和调试

相关文章持续更新中···