angrybacon / dragondrop

React playground featuring drag and drop à la Trello

Dragon’ Drop

This repository contains a small React playground.

Having approximately less than 24 hours of actual experience with React, this project is a naive enterprise at making a Trello-like board. Two lists, each list being a container for cards, with said cards being draggable from one list to another.

Installation

• bootstrap-material-design: https://fezvrasta.github.io/bootstrap-material-design/
• mdi: https://materialdesignicons.com/
• react: https://facebook.github.io/react/
• react-dnd: https://react-dnd.github.io/react-dnd/
• sass: http://sass-lang.com/

npm install
npm start

Todo

1. [X] Add drag and drop feature on cards
2. [ ] Implement vertical sorting
3. [ ] Websocketify
4. [ ] Make a mobile layout
5. [ ] Version-control the ESLint configuration
6. [ ] Add a preview at drop target
7. [ ] Use scripts/index.jsx rather than index.js
8. [ ] Use styles/index.scss rather than index.css
9. [ ] Add drag and drop feature on lists
10. [ ] Add horizontal scrolling

Screencasts