Creating a Fully Functional Kanban Board in Retool

💬 App Building
1

Hello everyone,

Has anyone ever created a Kanban board in Retool with full functionality, including drag and drop features? Perhaps using a Custom Component or the new Custom Component Beta?

I'm currently facing the challenge of developing such a Kanban board and would greatly appreciate any tips or advice.

Kind regards,
Davin

4 Likes
2

Hello @Davin ,

Yes, it's possible to create a fully functional Kanban board in Retool with drag-and-drop features. Many users have accomplished this by leveraging the Custom Component feature, including the latest Custom Component Beta 103. Here are some tips to help you:

  1. Use a Drag-and-Drop Library: Integrate libraries like React Beautiful DnD within a Custom Component to handle the drag-and-drop functionality effectively.
  2. Custom Component Setup: Utilize Retool's Custom Component Beta 103 to embed custom JavaScript or React components, allowing you to create a more interactive and flexible Kanban board.
  3. Data Binding: Connect your Kanban board to Retool’s backend using APIs or database queries to update the status and order of cards when they are moved.
  4. UI Enhancements: Ensure your board is responsive and includes visual feedback during interactions for a better user experience.
  5. Testing and Iteration: Start with a basic version to test the functionality and gather user feedback for improvements.
2 Likes
3

Hi @Davin! Thanks for reaching out.

I don't think there's a good native solution for building such an application - specifically when it comes to drag-and-drop functionality - but a custom component is a great idea if you're relatively comfortable with React development. Even if not, there are a bunch of good examples out there.

In addition to our docs, I'd recommend looking at react-dnd or react-beautiful-dnd. Let me know if you have any questions about getting started!

4

@Davin, Sharing these two posts here which seem to be related

1 Like