Skip to content

Latest commit

 

History

History
51 lines (38 loc) · 1.92 KB

README.md

File metadata and controls

51 lines (38 loc) · 1.92 KB
Raw

Monarch_Board

The Monarch_Board was a 3 day MintBean Hackathon project for the JavaScript Bootcamp Olympics! We were tasked to create a kanban board, focusing on an intuitive UX! A kanban board is an agile project management tool that helps a user visualize their todos and progress. From the kanban board, the user can add/delete tasks and columns, rename columns, and reorder tasks/columns.

Our board was implemented using React, using create-react-app, and react-beautiful-dnd for the the drag-and-drop feature. We also implemented react-modal for our modal integration upon adding new tasks and columns.

Let's get organized!

kanban_board_screenshot

Deployed at

Setup

  1. Clone down this repo
  2. Install the library dependencies. Run:
npm install
  1. Then, run npm start in your terminal. Go to http://localhost:3000/ and you should see the page there! Then, you can enter control + c in your terminal to stop the server at any time.

Technologies Used

  • React
  • create-react-app
  • Router
  • react-beautiful-dnd
  • react-modal

Future Iterations

  • Expand a task card to see its description
  • Move tasks between columns using the "Move" button in the context menu
  • Mobile-responsiveness
  • Each card has a context menu you can access through right-click (desktop).
  • Each card has a context menu you can access through long-press (mobile).
  • Nice animations
  • Access the context menu using right-click
  • Add images as attachments to the cards
  • Save data to LocalStorage or IndexedDB
  • Onboarding tutorial
  • Help text
  • Info bubbles
  • Helpful hints
  • Clear notifications

Contributors: