打开系统的命令行工具 .. 进入到你想保存项目的地方 ..

cd desktop

然后去克隆一个仓库 .. git clone .. 位置是 https://github.com/ninghao/semantic-course 把它放到 ninghao-semantic 这个目录的下面 .. 这里仓库里包含一个基本的网页，还有一些图像文件 ..

进入到这个目录的下面 ..

cd ninghao-semantic

确定你的电脑上已经安装好了 NodeJS，还有它的包管理工具 npm .. 先看一下 npm 的版本，输入

npm -v

我这里是 3.x 版本 .. 如果你的 npm 版本比这个低，可以去升级一下它 .. 用

npm install -g npm@3

再去创建一个 package.json .. 执行一下 npm init .. 然后一路回车 .. 完成以后，再用 npm 去安装 Semantic UI ..

npm install semantic-ui --save

过一会儿会出现一个提示，让我们设置一下 Semantic UI .. 这里问我们想怎么存储 Semantic UI 的组件还有输出的东西的位置 .. 默认是 Automatic ，自动设置 .. 你也可以选择 Express 快速设置 或者 Custom 去自定义 ..

这里我先选择默认的 Automatic .. 回车执行一下 .. 这一步会问你项目的目录是不是这里 .. 默认就是当前你所在的目录 .. 如果是，就按一下回车，不是可以选择 No ，然后自己选择一个目录 ..

Where should we put Semantic UI inside your project ，要把 Semantic 放到哪个目录的下面 .. 默认是 semantic 这个目录，回车 .. 这样就会按照刚才的配置去开始安装 Semantic UI ..

完成以后，进入到 semantic 这个目录的下面 ..

cd semantic

Semantic UI 定义了一些可以执行的任务，比如 build ，它可以去编译输出 Semantic UI：

gulp build

完成以后，用编辑器打开打开项目的目录 .. 在 semantic 下面的 dist 这个目录的下面，你可以找到编译好的 Semantic UI ..

回到终端 ... 返回上一级目录 .. 我们可以使用 Browsersync 创建一个服务器，然后监视一些文件的变化 .. 这样你可以在浏览器上实时的看到项目的变化 ...

browser-sync start --server --no-notify --files "index.html, semantic/dist/semantic.css"