diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 59a3a96..eab673b 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,17 +1,21 @@
-# Contributing to react-bootstrap-table2
+# Issues
+Before open issue, please make sure your problem/request is open or not. When open issue, please give following information if you can:
+* Example code or repo(Please keep it simple and minimal)
+* Reproduce steps
+* `react-bootstrap-table2` version
-## Commands
+Anyway, it's welcome to open issue to ask questions or feature request.
-### Testing
-In order to run the tests
+# Pull Requests
+Check [here](./docs/development.md) for getting start development.
-`yarn test`
+* When you want to implement a new feature, please let us know(via issues).
+* Please run test before opening PR and also remember to write test code.
+* If you PR is trying to fix bug, please describe the bug when PR open.
-testing with `watch mode`
+# For the member of react-bootstrap-table2 org
-`yarn test:watch`
-
-see the coverage report
-
-`yarn test:coverage`
+* Please convert ticket to issue when ticket move to `Ready` from `Backlog` in project
+* Please write document if any new API/feature/props changed or added
+* Please add story example if any new feature implement
\ No newline at end of file
diff --git a/docs/README.md b/docs/README.md
new file mode 100644
index 0000000..fd43f93
--- /dev/null
+++ b/docs/README.md
@@ -0,0 +1,21 @@
+# Documents
+
+## Props on BootstrapTable
+
+### keyField(**required**) - [String]
+`keyField` is a prop to tell `react-bootstrap-table2` which column is unigue key.
+
+### data(**required**) - [Array]
+Assign your table data via `data` prop. It only accept an Array object.
+
+### columns(**required**) - [Object]
+`columns` props accept an Array object, please see [columns definition](./columns.md) for more detail.
+
+### striped - [Bool]
+Same as `.table-striped` class for adding zebra-stripes to a table
+### bordered - [Bool]
+Same as `.table-bordered` class for adding borders on all sides of the table and cells
+### hover - [Bool]
+Same as `.table-hover` class for adding a hover effect (grey background color) on table rows
+### condensed - [Bool]
+Same as `.table-condensed` class for makeing a table more compact by cutting cell padding in half
\ No newline at end of file
diff --git a/docs/columns.md b/docs/columns.md
new file mode 100644
index 0000000..1a28af7
--- /dev/null
+++ b/docs/columns.md
@@ -0,0 +1,161 @@
+# Definition of columns props on BootstrapTable
+
+Available properties in a column object:
+
+* [dataField (**required**)](#dataField)
+* [text (**required**)](#text)
+* [formatter](#formatter)
+* [headerFormatter](#headerFormatter)
+* [formatExtraData](#formatExtraData)
+* [classes](#classes)
+* [style](#style)
+* [title](#title)
+* [events](#events)
+* [align](#align)
+* [headerTitle](#headerTitle)
+* [headerEvents](#headerEvents)
+* [headerAlign](#headerAlign)
+
+Following is a most simplest and basic usage:
+
+```js
+const rows = [ { id: 1, name: '...', price: '102' } ];
+const columns = [ {
+ dataField: id,
+ text: Production ID
+ }, {
+ dataField: name,
+ text: Production Name
+ }, {
+ dataField: price,
+ text: Production Price
+ }
+];
+```
+
+Let's introduce the definition of column object
+
+## column.dataField (**required**) - [String]
+Use `dataField` to specify what field should be apply on this column. If your raw data is nested, for example:
+
+```js
+const row = {
+ id: 'A001',
+ address: {
+ postal: '1234-12335',
+ city: 'Chicago'
+ }
+}
+```
+You can use `dataField` with dot(`.`) to describe nested object:
+
+```js
+dataField: 'address.postal'
+dataField: 'address.city'
+```
+
+## column.text (**required**) - [String]
+`text` will be apply as the column text in header column, if your header is not only text and you want to customize your header column, please check [`column.headerFormatter`](#headerFormatter)
+
+## column.formatter - [Function]
+`formatter` allow you to customize the table column and only accept a callback function which take four arguments and a JSX/String are expected for return.
+
+* `cell`
+* `row`
+* `rowIndex`
+* [`formatExtraData`](#formatExtraData)
+
+## column.headerFormatter - [Function]
+`headerFormatter` allow you to customize the header column and only accept a callback function which take two arguments and a JSX/String are expected for return.
+
+* `column`: column object itself
+* `colIndex`
+
+## column.formatExtraData - [Any]
+It's only used for [`column.formatter`](#formatter), you can define any value for it and will be passed as fourth argument for [`column.formatter`](#formatter) callback function.
+
+## column.classes - [String | Function]
+It's availabe to have custom class on table column:
+
+```js
+{
+ // omit...
+ classes: 'id-custom-cell'
+}
+```
+In addition, `classes` also accept a callback function which have more power to custom the css class on each columns. This callback function take three arguments and a string is expect to return:
+
+* `cell`
+* `row`
+* `colIndex`
+
+## column.style - [Object | Function]
+It's availabe to have custom class on table column:
+
+```js
+{
+ // omit...
+ style: { backgroundColor: 'green' }
+}
+```
+`style` like [`column.classes`](#classes), it accept a callback function too and have same arguments: `cell`, `row` and `colIndex`.
+
+## column.title - [Bool | Function]
+`react-bootstrap-table2` is disable [`HTML title`](https://www.w3schools.com/tags/tag_title.asp) as default. You can assign `title` as `true` to enable the HTML title on table column. In addition, you can custom the title via a callback function:
+
+```js
+{
+ // omit...
+ title: (cell, row, colIndex) => {
+ // return custom title here
+ }
+}
+```
+
+## column.headerTitle - [Bool | Function]
+`headerTitle` is only for the title on header column, default is disable. The usage almost same as [`column.title`](#title), it's also availabe to custom via a callback function:
+
+```js
+{
+ // omit...
+ headerTitle: (column, colIndex) => {
+ // column is an object and perform itself
+ // return custom title here
+ }
+}
+```
+
+## column.align - [String | Function]
+You can configure the [CSS text-align](https://www.w3schools.com/cssref/pr_text_text-align.asp) for table column by `align` property. However, `align` also accept a callback function for customizable reason and this function take fore arguments:
+
+* `cell`
+* `row`
+* `colIndex`
+
+## column.headerAlign - [String | Function]
+It's almost same as [`column.align`](#align), but it's for the [CSS text-align](https://www.w3schools.com/cssref/pr_text_text-align.asp) on header column. Also, you can custom the align by a callback function:
+
+```js
+{
+ // omit...
+ headerAlign: (column, colIndex) => {
+ // column is an object and perform itself
+ // return custom title here
+ }
+}
+```
+
+## column.events - [Object]
+You can assign any [HTML Event](https://www.w3schools.com/tags/ref_eventattributes.asp) on table column via event property:
+
+```js
+{
+ // omit...
+ events: {
+ onClick: e => { ... }
+ }
+}
+```
+
+## column.headerEvents - [Object]
+`headerEvents` same as [`column.events`](#events) but this is for header column.
\ No newline at end of file
diff --git a/docs/development.md b/docs/development.md
new file mode 100644
index 0000000..bf91e47
--- /dev/null
+++ b/docs/development.md
@@ -0,0 +1,28 @@
+## Development Guide
+
+### Setup
+```bash
+$ git clone https://github.com/react-bootstrap-table/react-bootstrap-table2.git
+$ cd react-bootstrap-table
+$ npm install
+$ lerna bootstrap # ./node_modules/.bin/lerna bootstrap
+```
+### Development
+```bash
+$ npm start
+```
+
+### Launch StoryBook
+We use [storybook](https://storybook.js.org/) to list our examples and it also have hot reload from source code. Sometime, it is also a good entry point to develop.
+
+```bash
+$ cd packages/react-bootstrap-table2-example
+$ npm run storybook
+```
+
+### Testing
+```bash
+$ npm test
+$ npm run test:watch # for watch mode
+$ npm run test:coverage # generate coverage report
+```
\ No newline at end of file
diff --git a/packages/react-bootstrap-table2/src/bootstrap-table.js b/packages/react-bootstrap-table2/src/bootstrap-table.js
index 36c8f00..4cbb69d 100644
--- a/packages/react-bootstrap-table2/src/bootstrap-table.js
+++ b/packages/react-bootstrap-table2/src/bootstrap-table.js
@@ -48,7 +48,10 @@ BootstrapTable.propTypes = {
keyField: PropTypes.string.isRequired,
data: PropTypes.array.isRequired,
columns: PropTypes.array.isRequired,
- striped: PropTypes.bool
+ striped: PropTypes.bool,
+ bordered: PropTypes.bool,
+ hover: PropTypes.bool,
+ condensed: PropTypes.bool
};
BootstrapTable.defaultProps = {