- Active application: here
video.mp4
This is a solution to the Kanban task management web app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the app depending on their device's screen size
- See hover states for all interactive elements on the page
- Create, read, update, and delete boards and tasks
- Receive form validations when trying to create/edit boards and tasks
- Mark subtasks as complete and move tasks between columns
- Hide/show the board sidebar
- Toggle the theme between light/dark modes
- Bonus: Allow users to drag and drop tasks to change their status and re-order them in a column
- Bonus: Keep track of any changes, even after refreshing the browser!
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Typescript
- Next.js - React framework
- TailwindCSS - CSS framework
- Redux Toolkit - for managing and centralizing application state.
- Jest - testing framework
- axios - to get data from json
- React Hook Form - to validate the form
- redux-mock-store - to dispatch actions and verify actions dispatched during component testing
- Storybook - to test and document the components!
I'm so glad I completed this amazing challenge! I've learned a lot along the way and I feel my development has benefited from this challenging project. While it took a little longer than expected due to my familiarity with some technology, I'm thrilled to finally have it done!
I faced several challenges during the project, especially regarding organization, which was a challenging aspect to maintain. However, I believe I managed to do a good job in this regard. It was my first time working on such a large project with multiple technologies, which made it difficult to organize everything and keep the code clean. Even so, I'm confident I did a good job!
- Linkedin - AdrianoEscarabote
- Frontend Mentor - @AdrianoEscarabote
- Instagram - @ogdrian
- Twitter - @drianEscarabote