# 快速上手


## 前置知识

使用 D2Admin 首先组要有以下前置知识：

* 首先需要熟悉 web 开发基础三样：[HTML CSS JavaScript](http://www.w3school.com.cn/)
* 需要有 [ES6](http://es6.ruanyifeng.com/) 语法知识
* 会使用 [vue.js](https://cn.vuejs.org/)

如果你了解以下技术，在使用本项目进行你的开发时会更加得心应手：

* [sass](https://www.sass.hk/guide/)

## 准备

在上手之前，建议您先大致浏览以下章节，对整个系统有大致了解：

* 每个页面最基础的构成部分：[页面容器](../components/container.md)
* 一些你会用到的全局数据和方法：[VUEX 实用工具](../plugins/vuex.md)
* 一些你会用到的公用方法：[Util 实用工具](../plugins/util.md)

如果你想了解更多 D2Admin 相关的教程和更新文章，可以参阅 [文章](../article/)

## 下载项目

* 完整版仓库 [Github](https://github.com/d2-projects/d2-admin) | [码云](https://gitee.com/fairyever/d2-admin)

* 简化版起始模板 [Github](https://github.com/d2-projects/d2-admin-start-kit) | [码云](https://gitee.com/fairyever/d2-admin-start-kit)

挑选一个你喜欢的网站 Fork D2Admin 代码到你的仓库，然后下载或克隆。

::: tip
如果你使用 Github 下载过慢，请参考 [常见问题](question.md)。
:::

我的建议是使用 **简化版起始模板** 因为在完整版的基础上做减法，要比在简化版基础上做加法复杂。

## 资源

下面是一些在开发过程会用到的文档，列举在这里方便大家快速查看：

组件库：

* [element-ui](http://element.eleme.io/#/zh-CN/component/quickstart)

项目基础：

| 名称 | 介绍 |
| --- | --- |
| [vue.js](https://cn.vuejs.org/v2/guide/) | 框架基础 |
| [vuex](https://vuex.vuejs.org/zh/guide/) | 全局状态管理 |
| [vue-router](https://router.vuejs.org/zh/guide/) | 路由控制 |
| [sass](https://www.sass.hk/guide/) | CSS 预处理语言 |

脚手架：

| 名称 | 介绍 |
| --- | --- |
| [vue-cli3](https://github.com/vuejs/vue-docs-zh-cn/tree/master/vue-cli) | 项目脚手架 |
| [webpack-chain](https://github.com/mozilla-neutrino/webpack-chain) | vue-cli3 中 webpack 的配置语法 |

插件：

| 名称 | 介绍 |
| --- | --- |
| [axios](https://github.com/axios/axios) | 最流行的网络请求库 |
| [better-scroll](https://github.com/ustbhuangyi/better-scroll) | [d2-container](../components/container.md) 的自定义滚动条依赖 |
| [dayjs](https://github.com/iamkun/dayjs) | 日期处理库 |
| [v-charts](https://v-charts.js.org/#/props) | vue 版本的 echarts 由饿了么开发 |
| [echarts](http://echarts.baidu.com/index.html) | v-charts 的核心 |
| [lowdb](https://github.com/typicode/lowdb) | D2Admin 操作本地数据的依赖 |
| [mockjs](https://github.com/nuysoft/Mock/wiki) | 模拟请求依赖 |
| [vue-i18n](https://kazupon.github.io/vue-i18n/guide/started.html) | 多国语依赖 |
| [vue-grid-layout](https://github.com/jbaysolutions/vue-grid-layout) | 网格布局组件 |
| [vue-splitpane](https://www.npmjs.com/package/vue-splitpane) | 切分布局组件 |

上面只是一些猜你会用到的链接，还有一些项目中用到但是这里没有列举的，如果你觉得有必要，可以提 pr 修改本篇文档。