Announcing React Kanban

Today, I'm excited to announce the first release of react-kanban-dnd. React Kanban is a library that implements a kanban board (click here if you don't know what it is) and it helps you to organize any kind of things in your project.

React Kanban idea comes from a project inside of Entria. We needed something like GitHub's Project and we didn't find any project customizable enough.

I created it over the react-beautiful-dnd, huge thanks to you guys, for providing this awesome DnD lib.

One of the most things I've learned with this project is if you've done something cool on your company, talk with your teammates and make it open source. You will be helping the community, improving and polishing the code for your company.

Install and Usage

First, you need to install react-kanban-dnd on your project

yarn add react-kanban-dnd

Now, we're good to go:

import ReactKanban from 'react-kanban-dnd';

export default class MyKanban extends React.Component {
  render() {
    return (
      <ReactKanban
        onDragEnd={this.onDragEnd}
        onDragStart={this.onDragStart}
        renderCard={this.renderCard}
        columns={columns}
        columnStyle={style.columnStyle}
        columnHeaderStyle={style.columnHeaderStyle}
        columnTitleStyle={style.columnTitleStyle}
        cardWrapperStyle={style.cardWrapperStyle}
      />
    );
  }
}

Get started

You can find react-kanban-dnd and the docs here. Every kind of contribution is very welcome: issues, pull requests, feature requests. You can ping me at Twitter as well.

Future

Our roadmap is under development, but we have some items already:

• Move to Lerna

Beside that, react-kanban-dnd was developed to work with GraphQL. So, one of the next steps is the possibility of Relay Modern integration.

I hope you enjoy it. Any feedback comment here or open an issue.