Skip to content
Submitted about 2 years ago

kanban web app with context api and reducers with typescript and immer

accessibility, bem, react, typescript, vite
Samuel•840
@Samuel-Amaro
A solution to the Kanban task management web app challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

This project was very challenging from the start, it took longer than I had estimated, the biggest challenges were building accessible components with focus management, in addition to the data structure for the client-only boards, there were many challenges, which I encountered when trying to build this project, however it was gratifying to see the result, feel free to evaluate the code and give me tips on what I can improve.

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Christopher Adolphe•620
    @christopher-adolphe

    Hi @Samuel-Amaro 👋

    You did a great job on this challenge. 👍 I had a quick look at the application as well as the code base and here's my feedback:

    • The buttons for the dropdown menus are too small (4px by 20px) and as a result, this reduces the both touch and click accuracy. For better user experience, the recommended size of icon buttons should be in a range of 42 to 72px.
    • I think the Content component file contains too many sub components. You could have moved ColumnBoard, TaskList and CardTask in dedicated component files under the components directory. These components indeed compose your content but each of them have different responsibilities which is why I think good to separate them. However, this one is only a personal preference 😉 I know React gives you the freedom of organising your folder structure any way you want.

    I hope this helps.

    Keep it up.

    Marked as helpful

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord