编辑器的左边这块儿显示的就是项目里面的一些目录还有文件 ... .git 里面的东西是项目的仓库 .. 一般你不会用到这个目录下面的东西.. 点开头的文件或者目录在 unix 类型的系统上默认会被隐藏起来 ..

我们的 html，css 还有 javascript 文件，可以放在 app 这个目录的下面。 node_modules 是项目依赖的一些功能包 ..

semantic 是 semantic ui 这个框架所在的位置。这里面包含了一些 css 还有 js 文件。 我们以后会介绍到怎么样去使用它们 .. 现在你只需要知道这个目录里面放的是什么就行了 ..

.babelrc 是 babel 工具的配置文件， babel 可以转换我们写的 js 代码，有了它，你可以使用现在浏览器还不支持的新的 js 语法去写代码。 babel 会为你把代码转换成浏览器能看懂的 js 语法。

这里用了一个 es2015 预设，这样 babel 就会认识你写的 es2015 标准的代码了。es 表示的是 ecmascript ，它是 javascript 的一套标准与规范， 2015 是版本号，ecmascript 会使用年份来表示不同版本的规范 ..

.editorconfig ，是编辑器的配置，如果你的编辑器安装了 editorconfig 插件，会读取这个配置文件里的内容去配置你的编辑器。比如这里设置了代码缩进的类型是 space ，也就是空格 .. 缩进的大小是 2，表示两个空格 ..

.gitignore 是用 git 为项目做版本控制的时候要忽略的一些东西 ... 也就是你可以把一些不想用 git 跟踪的目录和文件在这个配置文件里列出来 ..

gulpfile.babel.js，这个文件很重要，它里面定义了一些要执行的任务，比如把 sass 编译成 css ，创建本地服务器等等，一会儿我们单独再介绍一下这些任务。

在 package.json 这个文件里描述了整个项目 ...

README.md 是一个说明文档，md 表示 markdown ，是一种文字格式。

semantic.json 是我们用的 semantic ui 这个框架的配置文件，它里面主要说明了一下 semantic ui 框架需要的一些目录的位置。

yarn.lock 是 yarn 包管理工具要用的东西，在这个文件里描述了为项目安装的所有的包的具体的版本。

在其它的项目上，你很可能会看到类似的文件与目录。你不需要记住所有这些目录与文件的作用。不过了解一下可以解决很多疑惑。