Build a draggable Kanban Board with React, Chakra UI and LocalStorage
👀 Demo: https://dnd-kanban-board.vercel.app/
🌱 Source Code: https://github.com/CodeWithGionatha-L...
💬 Discord: / discord
📚 Resources
Vite: https://vitejs.dev/guide/
ChakraUI: https://chakra-ui.com/getting-started
React-DnD: https://react-dnd.github.io/react-dnd...
Autoresizable Textarea: https://www.npmjs.com/package/react-t...
Typescript Hooks: https://github.com/juliencrn/usehooks-ts
In this video, we are going to build a modern drag-and-droppable Kanban board by using React, ChakraUI, and Typescript.
Chapters
00:00 Intro
01:05 Project Setup
03:38 Custom Theme
04:42 Heading Text
05:46 Entities
06:52 Task component
09:19 Column component
14:04 LocalStorage persistence
15:27 Add new task
18:46 Update and delete
21:32 Auto Resizable Textarea
22:54 Implementing dragging
27:36 Implementing drop
31:21 Implementing task swapping
35:53 Dark mode
36:54 Outro
#react #tutorial #kanbanboard #draganddrop #localstorage
Смотрите видео Build a draggable Kanban Board with React, Chakra UI and LocalStorage онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Code With Gionatha 31 Август 2022, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 34,45 раз и оно понравилось 1 тысяч людям.