How To Build A Drag & Drop Kanban Board With JavaScript

Подписаться 24 тыс.

Просмотров 38 тыс.

50% 1

Animated UI components for React, Tailwind CSS, Framer Motion & More ✨ www.hover.dev
Drag & drop functionality is super useful for all sorts of apps & websites. With the HTML Drag and Drop API, it's a lot easier than you might think to get drag and drop up and running.
In todays video we'll do just that by creating a simple Trello style Kanban board using only HTML, CSS and JavaScript.
#programming #JavaScript #coding #webdevelopment
📚 Project Links
Github: github.com/Tom...
🔗 My Links
GitHub: github.com/Tom...
Twitter: / tomisloading
Instagram: / tomisloading
TikTok: / tomisloading

Опубликовано:

15 окт 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 35

@talangan 4 дня назад

Awesome thanks. I was able to adapt this for a lacrosse team draft.

@l34l 18 дней назад

Admirable. Thank you so much for sharing this.

@FunnyVideos-ni4iu 9 месяцев назад

Thanks a lot Tom! This was the best javascript kanban tutorial, cheers

@tomisloading 9 месяцев назад

Happy I can help! :)

@CynthiaChen2020 Год назад

really appreciate your efforts for the tutorial, I use basic idea from it and add "drop" listener to my project to better work with server side. The deco looks beautiful!

@martin-xq7te 10 месяцев назад

Great tutorial Tom. Thank You

@tomisloading 10 месяцев назад

Thank you!! 😁

@sai_charan Год назад

Stumbled upon you recently. Excellent content, keep going!

@tomisloading Год назад

Thank you!!! I'll do my best!! :)

@CLeovison Год назад

Hey man! You deserve a more subscriber, the way you teach is so so good

@tomisloading Год назад

Thank you!! :)

@joaopedrogomes7259 6 месяцев назад

Prime content right here!

@lizacrowi245 Год назад

you saved my life thank youu so much

@thanosarampatzis7164 6 месяцев назад

Amazing video Tom great job! could be possible instructions to read the to-do list from js or from other external file?

@colindante5164 11 месяцев назад

Awesome tutorial. Thankyou much ))

@cyrilpiot3697 Год назад

Hi, Thank you so much great tutorial!

@lina_adil Год назад

Hey man, I follow you on TikTok I was searching about Kanban boards and found your video, Very helpful. Thank you for the content. also, the drag and drop doesn't seem to work on the mobile version any suggestions? I would appreciate a video with the delete and edit button too blessings

@ParamjeetKaur-we9wg 8 месяцев назад

This is great

@mistercoder7411 Год назад

Very nice, but a save option is necessary to avoid rewriting all tasks everytime.

@CowMeCow 5 месяцев назад

Would be great if something like this can be added as WordPress Plugin, or as Addon for "Bricks Builder"

@appstuff6565 Год назад

Hey tom thanks for this! Im using supabase so how do i save the sorting arrangement for each user?

@جوادجیتی Год назад

thanks its so interesting like trello

@Krat_os_ 6 месяцев назад

How can I make sure that everything remains in place after the update?

@GS-st2sp Год назад

can you build a kan ban board with time tracking?? I would love to learn how to do that.

@jonahssegawa472 11 месяцев назад

I'm really confused about the insertAboveTask function mostly why you used the Negative_infinity

@jonahssegawa472 11 месяцев назад

Please may I get some help

@caesarbala 10 месяцев назад

offset is negative number offset < 0 and (offset > closestTask ) so closestTask should be lesser than negative on default so he used negative infinity.