This is a solution to the Kanban task management web app challenge on Frontend Mentor.
This project was bootstrapped with Create React App, using the Redux and Redux Toolkit TS template.
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
- Allow users to drag and drop tasks to change their status and re-order them in a column
- Keep track of any changes, even after refreshing the browser (
localStorage
could be used for this if you're not building out a full-stack app)
- React
- Redux Toolkit
- Redux Persist
- TailwindCSS
- TypeScript
- Mobile-first workflow
- Clone the repo
git clone https://github.com/yjcyun/kanban-app.git
- In the project root directory, install NPM packages
npm install
- Start developing
npm run start
- Builds the app for production to the
build
folder.
npm run build
- Deploy on Netlify 🚀