WebStorm安装和配置
WebStorm作为集成开发环境（IDE）相比直接使用记事本来编写代码，IDE可以为我们提供更加完善的代码编写体验，比如语法错误检查，代码提示等，同时它还集成了一些常用的开发工具。
下载地址：WebStorm：JetBrains 出品的 JavaScript 和 TypeScript IDE
我们直接点击下载即可：
这个软件针对于个人来说免费使用的，各位小伙伴无需担心后续使用问题。
下载好之后，直接安装即可，这个不强制要求安装到C盘，自己随意，但是注意路径中不要出现中文。
这里勾选一下创建桌面快捷方式就行：
安装完成后，我们直接打开就可以了：
此时界面是全英文，如果各位小伙伴看得惯，可以直接使用全英文的界面（使用英文界面可以认识更多的专业术语词汇，但是可能看起来没中文那么直观，而且IDEA本身功能就比较多，英语不好的小伙伴就很头疼）这里还是建议使用中文界面，要使用中文只需在Customize里面配置语言即可：
如果各位小伙伴不喜欢黑色主题，也可以修改为白色主题，只需要在自定义中进行修改即可，一共四种主题。
接下来，我们来看看如何使用WebStorm创建一个新的Web项目，WebStorm是以项目的形式进行管理的，所以说我们直接创建一个新的项目即可，点击新建项目，然后选择空项目：
最后一级目录就是我们的项目名称，这里我们起名为HelloWorld即可，然后点击右下角的创建按钮。
进入之后，我们可以看到项目目录下没有任何文件（这里的.idea目录是WebStorm项目的相关设置，直接无视即可）
这里我们来尝试编写一个简单的页面看看能否正常加载，我们右键项目目录，然后选择新建一个HTML文件：
这里我们将其命名为index，此时项目目录下就会出现一个新的index.html文件：
这是一个最基本的网页源代码文件，可以看到里面写了很多我们暂时还看不懂的代码，不过没关系，我们现在只是简单体验一下，并不需要各位小伙伴马上理解其中的含义。
这里我们尝试在body中编写一些测试的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>Hello World</div>
</body>
</html>接着，我们可以在浏览器中查看我们编写的网页长什么样子，在WebStorm的右上角有一个选择栏，我们可以直接点击然后让对应的浏览器展示我们的页面：
这里我们以Chrome作为测试开发浏览器，打开后就是这样的：
