Skip to content

Latest commit

 

History

History
47 lines (28 loc) · 1.95 KB

README.md

File metadata and controls

47 lines (28 loc) · 1.95 KB
Raw

Peerlist Profile Kanban Board 💚

This Drag and drop board has been made using NextJS, React Beautiful DND, Tailwind CSS, React-table and React Toastify.

Features:

  • Drag and Drop applicants

    The major purpose of the drag and drop board is to drag applicants to different stages of their job application. Three statuses that I mentioned are

    • REJECTED
    • APPLIED
    • SHORTLISTED

  • Search

    It allows you to search within these drag and drop lists, it updates on realtime when you search.

  • State Management

    I have used Redux for the ease of state management and manipulation for the drag and drop

  • State Persistence

    I have used redux-persist to persist the state of the board so that even refresh does not hamper the state of your lists!!!

  • You can Reject Me

    I would ask you to reject me on the board, there is a sweet and simple message for you, I hope you enjoy the Pun 💚

Performance Metrics and Enhancements

  • The Total Blocking Time of the app is 10ms (which is quite good :)
  • The First Contentful Paint of the app is 0.5s
  • Overall performance of the app is 100(Desktop) and 94(Mobile) with 100 SEO rating.

Have a look at the ratings report here

rating report

Assumptions and Default App Behaviour

  • I have used Inter font family from google fonts.

  • The lists are not draggable, as I feel it's a cool Tinder like UI right now,

    • Right Swipe Shortlisted
    • Left Swipe Rejected

  • I have created a ts file initialState.js with a certain set of random applicant's detail, it could be easily replaced via an API call, as Redux is managing the whole state management of the board.