- The latest version of React should be used.
- Hooks only. This means, no classes are allowed.
Emotion-js
for styling.Persistence
: cards should be stored in thelocal_storage
and you should simulate5 seconds
of delay while fetching the list of cards.- Please use Skeleton while fetching cards.
- Unit Testing: At least two main components(i.e
Creation form
andFilters
).
-
Implement a Kanban Board with three columns, "To Do", "In Progress" and "Done" where users can
add
,edit
, anddelete
issues (Cards). When a user adds a new card, this one should be placed at the bottom of the "To Do" column.- The forms to
create
anddelete
cards should be placed in amodal
. - A
confirmation modal
should be displayed before deleting a card.
Every card should have the following fields:
- Title
- Description
- Tag (SEO, Long Form, Blog Post)
- Assignee
- Due Date
- The forms to
-
Implement the
drag and drop
functionality where users should be able to selectone or multiple
cards and move them from one column to another. When dropping one or more cards into a column containing other cards, the new cards should be added at the bottom, keeping the same order they had before. (You can use a lib) -
Implement a
search
to filter cards based on the following fields:- Title
- Assignee
- Tags