1. 工欲善其事 必先利其器

1.1 开发工具

Visual Studio Code [[点击下载]](https://code.visualstudio.com/docs?dv=win&wt.mc_id=DX_841432&sku=codewin)

轻量级、功能强大的代码编辑工具

Node.js [[点击下载]](https://nodejs.org/en/download/)

前端开发必备

1.1.1 安装Node.js

window安装

点此 下载 完成之后，双击已经下载的安装包。
一路下一步。直到需要你重启电脑。

重启完成电脑之后，按 Win+R 输入 cmd。 打开命令行工具，输入node -v。如果正常输入了v10.15.0或者更高的版本号，表明你已经安装成功了Node.js在自己的电脑中。

Mac安装

点此 下载 完成之后，双击已经下载的安装包。
一路下一步。直到需要你重启电脑。

重启完成电脑之后，打开Application中的实用工具。打开控制台程序，输入node -v。如果正常输入了v10.15.0或者更高的版本号，表明你已经安装成功了Node.js在自己的电脑中。

1.1.2 安装Visual Studio Code

window安装

通过[[点击下载]](https://code.visualstudio.com/docs?dv=win&wt.mc_id=DX_841432&sku=codewin)下载完，得到一个安装包，根据自己的需要选择安装目录。安装完成之后，VS Code 会出现在你的桌面上。

Mac安装

通过[[点击下载]](https://code.visualstudio.com/docs/?dv=osx)下载完，得到一个pkg安装包,打开之后默认安装。安装完成之后，VS Code 会出现在你的Application中，你可以将VS Code锁定在Mac的dock中。

1.1.3 VisualStudio Code 插件选择

Chinese (Simplified) Language Pack for Visual Studio Code

VS Code中文语言包，在当前国情下应该是必要的插件。

ESLint

对你的JS代码格式进行强校验

Git History

查看当前文件的Git提交记录

GitLens — Git supercharged

非常强大的Git辅助工具，直接使VS Code 比肩 webstorm。

JavaScript (ES6) code snippets

ES6 语法快捷输入扩展

1.2 安装Git

Git [[点此下载]](https://git-scm.com/)

进入网站之后，点击右边的Download即可下载符合你当前系统的git版本。