docs: add documentation of third-party and awesomeness (#4559)

* docs: add documentation of third-party and awesomeness

* docs: merge install.md into introduce.md

* docs: update recommendation components list
This commit is contained in:
Benjy Cui 2017-01-12 17:57:04 +08:00 committed by 偏右
parent 6a015f00e6
commit ff67c6eee6
9 changed files with 139 additions and 156 deletions

View File

@ -1,5 +1,5 @@
---
order: 6
order: 9
title: Change Log
toc: false
timeline: true

View File

@ -1,5 +1,5 @@
---
order: 6
order: 9
title: 更新日志
toc: false
timeline: true

View File

@ -0,0 +1,5 @@
---
order: 8
title: Awesome Ant Design
link: https://github.com/websemantics/awesome-ant-design
---

View File

@ -1,66 +0,0 @@
---
order: 2
title: Installation
---
## Using npm to install
**We recommend using npm to install**it not only makes development easierbut you can also take advantage of the whole ecosystem.
If using npm to install, you could use `import` or `require`.
Stable version
[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
```bash
$ npm install antd --save
```
You can subscribe to this feed for new version notification: https://github.com/ant-design/ant-design/releases.atom
Beta version
[![](https://cnpmjs.org/badge/v/antd.svg?&tag=beta&subject=npm)](https://www.npmjs.org/package/antd)
```bash
$ npm install antd@beta --save
```
## Import in Browser
[![CDNJS](https://img.shields.io/cdnjs/v/antd.svg?style=flat-square)](https://cdnjs.com/libraries/antd)
We provide `antd.js` `antd.css` and `antd.min.js` `antd.min.css` under `antd/dist` in antd's npm package, in order to import all the components of antd directly. Also, you can use [unpkg](https://unpkg.com/).
> It's not recommended to use the already built files, as you cannot get bugfixes from the dependencies of antd.
#### stable
- https://unpkg.com/antd/dist/antd.js
- https://unpkg.com/antd/dist/antd.css
- https://unpkg.com/antd/dist/antd.min.js
- https://unpkg.com/antd/dist/antd.min.css
#### beta
- https://unpkg.com/antd@beta/dist/antd.js
- https://unpkg.com/antd@beta/dist/antd.css
- https://unpkg.com/antd@beta/dist/antd.min.js
- https://unpkg.com/antd@beta/dist/antd.min.css
> Here is an [example](https://github.com/ant-design/antd-init/tree/master/examples/build-antd-standalone) of how to build your own antd.js if you are using antd@<1.0.0.
## Development tool
We provide React components [Scaffold tool](https://github.com/dvajs/dva-cli).
```bash
$ npm install dva-cli -g
```
Run `dva new myapp` to init a React application.
You can explore the latest structure of scaffold [here](https://github.com/dvajs/dva-cli/tree/master/boilerplates), it is a good habit to watch this repo to get the latest features.
> [More development tool features](https://github.com/sorrycc/roadhog)。

View File

@ -1,66 +0,0 @@
---
order: 2
title: 安装
---
## 使用 npm 安装
**我们推荐使用 npm 的方式进行开发**,不仅可在开发环境轻松调试,也可放心地在生产环境打包部署使用,享受整个生态圈和工具链带来的诸多好处。
可以通过 npm 直接安装到项目中,使用 `import``require` 进行引用。
稳定版:
[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
```bash
$ npm install antd --save
```
你可以订阅https://github.com/ant-design/ant-design/releases.atom 来获得稳定版发布的通知。
开发版本:
[![](https://cnpmjs.org/badge/v/antd.svg?&tag=beta&subject=npm)](https://www.npmjs.org/package/antd)
```bash
$ npm install antd@beta --save
```
## 浏览器引入
[![CDNJS](https://img.shields.io/cdnjs/v/antd.svg?style=flat-square)](https://cdnjs.com/libraries/antd)
我们在 npm 发布包内的 `antd/dist` 目录下提供了 `antd.js` `antd.css` 以及 `antd.min.js` `antd.min.css` 用于一次性引入所有的 antd 组件,也可以通过 [UNPKG](https://unpkg.com/) 进行下载。
> 不推荐使用构建文件,因为难以获得底层依赖模块的 bug 快速修复支持。
#### stable
- https://unpkg.com/antd/dist/antd.js
- https://unpkg.com/antd/dist/antd.css
- https://unpkg.com/antd/dist/antd.min.js
- https://unpkg.com/antd/dist/antd.min.css
#### beta
- https://unpkg.com/antd@beta/dist/antd.js
- https://unpkg.com/antd@beta/dist/antd.css
- https://unpkg.com/antd@beta/dist/antd.min.js
- https://unpkg.com/antd@beta/dist/antd.min.css
> 对于 1.0 之前的版本,这里有一个 [自行构建的例子](https://github.com/ant-design/antd-init/tree/master/examples/build-antd-standalone) 以供参考。
## 开发工具
我们提供了 React 前端应用开发的 [脚手架工具](https://github.com/dvajs/dva-cli),可以安装到全局直接使用。
```bash
$ npm install dva-cli -g
```
运行 `dva new myapp` 可以初始化一个 React 的前端应用。
最新的脚手架结构可以到这里 [查看](https://github.com/dvajs/dva-cli/tree/master/boilerplates),建议持续关注更新以便获得最新的开发工程特性。
> 更多开发工具的[特性](https://github.com/sorrycc/roadhog)。

View File

@ -31,12 +31,63 @@ Following Ant Design specification, We develop a React UI library `antd` that co
- It is a set of high quality UI components and based on [React Component](http://react-component.github.io/badgeboard/).
- Provides a work flow which is based on npm, webpack, and babel, supporting ES2015 and TypeScript.
## Compatibility
Modern browsers and IE9+.
> [IE8 issues](https://github.com/xcatliu/react-ie8)
## Version
- Stable: [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
- Beta: [![](https://cnpmjs.org/badge/v/antd.svg?&tag=beta&subject=npm)](https://www.npmjs.org/package/antd)
You can subscribe to this feed for new version notification: https://github.com/ant-design/ant-design/releases.atom
## Installation
### Using npm to install
**We recommend using npm to install**it not only makes development easierbut you can also take advantage of the whole ecosystem.
If using npm to install, you could use `import` or `require`.
Stable version
```bash
$ npm install antd --save
```
Beta version
```bash
$ npm install antd@beta --save
```
### Import in Browser
[![CDNJS](https://img.shields.io/cdnjs/v/antd.svg?style=flat-square)](https://cdnjs.com/libraries/antd)
We provide `antd.js` `antd.css` and `antd.min.js` `antd.min.css` under `antd/dist` in antd's npm package, in order to import all the components of antd directly. Also, you can use [unpkg](https://unpkg.com/).
> It's not recommended to use the already built files, as you cannot get bugfixes from the dependencies of antd.
#### stable
- https://unpkg.com/antd/dist/antd.js
- https://unpkg.com/antd/dist/antd.css
- https://unpkg.com/antd/dist/antd.min.js
- https://unpkg.com/antd/dist/antd.min.css
#### beta
- https://unpkg.com/antd@beta/dist/antd.js
- https://unpkg.com/antd@beta/dist/antd.css
- https://unpkg.com/antd@beta/dist/antd.min.js
- https://unpkg.com/antd@beta/dist/antd.min.css
> Here is an [example](https://github.com/ant-design/antd-init/tree/master/examples/build-antd-standalone) of how to build your own antd.js if you are using antd@<1.0.0.
## Usage
### Use prebuilt bundle
@ -77,17 +128,6 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
import 'antd/lib/date-picker/style/css'; // with style
```
## Version
- Stable: [![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
- Beta: [![](https://cnpmjs.org/badge/v/antd.svg?&tag=beta&subject=npm)](https://www.npmjs.org/package/antd)
## Compatibility
Modern browsers and IE9+.
> [IE8 issues](https://github.com/xcatliu/react-ie8)
## Useful Links
- [Home page](http://ant.design/)

View File

@ -31,12 +31,63 @@ title: Ant Design of React
- [React Component](http://react-component.github.io/badgeboard/) 基础上精心封装的高质量 UI 组件。
- 基于 npm + webpack + babel 的工作流,支持 ES2015 和 TypeScript。
## 浏览器支持
现代浏览器和 IE9 及以上。
> [IE8 issues](https://github.com/xcatliu/react-ie8)
## 版本
- 稳定版:[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
- 开发版:[![](https://cnpmjs.org/badge/v/antd.svg?&tag=beta&subject=npm)](https://www.npmjs.org/package/antd)
你可以订阅https://github.com/ant-design/ant-design/releases.atom 来获得稳定版发布的通知。
## 安装
### 使用 npm 安装
**我们推荐使用 npm 的方式进行开发**,不仅可在开发环境轻松调试,也可放心地在生产环境打包部署使用,享受整个生态圈和工具链带来的诸多好处。
可以通过 npm 直接安装到项目中,使用 `import``require` 进行引用。
稳定版:
```bash
$ npm install antd --save
```
开发版本:
```bash
$ npm install antd@beta --save
```
### 浏览器引入
[![CDNJS](https://img.shields.io/cdnjs/v/antd.svg?style=flat-square)](https://cdnjs.com/libraries/antd)
我们在 npm 发布包内的 `antd/dist` 目录下提供了 `antd.js` `antd.css` 以及 `antd.min.js` `antd.min.css` 用于一次性引入所有的 antd 组件,也可以通过 [UNPKG](https://unpkg.com/) 进行下载。
> 不推荐使用构建文件,因为难以获得底层依赖模块的 bug 快速修复支持。
#### stable
- https://unpkg.com/antd/dist/antd.js
- https://unpkg.com/antd/dist/antd.css
- https://unpkg.com/antd/dist/antd.min.js
- https://unpkg.com/antd/dist/antd.min.css
#### beta
- https://unpkg.com/antd@beta/dist/antd.js
- https://unpkg.com/antd@beta/dist/antd.css
- https://unpkg.com/antd@beta/dist/antd.min.js
- https://unpkg.com/antd@beta/dist/antd.min.css
> 对于 1.0 之前的版本,这里有一个 [自行构建的例子](https://github.com/ant-design/antd-init/tree/master/examples/build-antd-standalone) 以供参考。
## 示例
```jsx
@ -57,17 +108,6 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
> babel-plugin-import 支持 js 和 css 同时按需加载。
## 版本
- 稳定版:[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
- 开发版:[![](https://cnpmjs.org/badge/v/antd.svg?&tag=beta&subject=npm)](https://www.npmjs.org/package/antd)
## 浏览器支持
现代浏览器和 IE9 及以上。
> [IE8 issues](https://github.com/xcatliu/react-ie8)
## 链接
- [首页](http://ant.design/)

View File

@ -0,0 +1,15 @@
---
order: 7
title: Third-Party Library
---
`antd` is designed to provide high-quality React UI components which following Ant Design Specification. So, we are not going to implement other functions which are not relative to `antd`'s target, and recommend to use excellent third-party library which are provided by React community:
* **Router: ** [react-router](https://github.com/ReactTraining/react-router)
* **Layout: ** [react-blocks](http://whoisandie.github.io/react-blocks/)
* **Drag and drop: ** [react-dnd](https://github.com/gaearon/react-dnd)
* **Editor: ** [react-codemirror](https://github.com/JedWatson/react-codemirror)
* **Color Picker: ** [rc-color-picker](https://github.com/react-component/color-picker), [react-color](http://casesandberg.github.io/react-color/)
* **Media Query: ** [react-responsive](https://github.com/contra/react-responsive), [react-media](https://github.com/ReactTraining/react-media)
* **Copy to clipboard: ** [react-copy-to-clipboard](https://github.com/nkbt/react-copy-to-clipboard)
* **Document head manager: ** [react-helmet](https://github.com/nfl/react-helmet)

View File

@ -0,0 +1,15 @@
---
order: 7
title: 社区精选组件
---
`antd` 是 Ant Design 设计规范的 React 实现,所以我们倾向于只提供符合该规范、且带有视觉展现的 UI 组件,也尽量不重复造轮子。我们推荐使用以下社区已有的优秀实现,与 antd 形成互补:
* **路由:** [react-router](https://github.com/ReactTraining/react-router)
* **布局:** [react-blocks](http://whoisandie.github.io/react-blocks/)
* **拖拽:** [react-dnd](https://github.com/gaearon/react-dnd)
* **编辑器:** [react-codemirror](https://github.com/JedWatson/react-codemirror)
* **拾色器:** [rc-color-picker](https://github.com/react-component/color-picker)、[react-color](http://casesandberg.github.io/react-color/)
* **Media Query** [react-responsive](https://github.com/contra/react-responsive)、[react-media](https://github.com/ReactTraining/react-media)
* **复制到剪贴板:** [react-copy-to-clipboard](https://github.com/nkbt/react-copy-to-clipboard)
* **管理 document head** [react-helmet](https://github.com/nfl/react-helmet)