react-sortable-hoc VS react-table

I suggest using this library for DnD.

react-sortable-hoc can help you with this.

react-sortable-hoc - considered deprecated in favour of dnd-kit.

I used https://github.com/clauderic/react-sortable-hoc

Package link:- https://www.npmjs.com/package/react-sortable-hoc

the library that I found is "https://github.com/clauderic/react-sortable-hoc" with this library, you can drag and drop horizontally or vertically or in a grid and sort it in the way you want:)! if you look at the Link you will see a sortable item component and a sortable list, we will wrap the sortable list in a sort of container and we wrap the sortable item in sortable elements! also, you will see sorted! what's that? well, when we move things around we are changing the order of their states too:S so this will update the state to show which element is in which state.

Tanstack - Tanstack has evolved to an entire ecosystem consisting of the famous Tanstack (or React) Query, Tanstack Table, now also Tanstack Router and Tanstack Form. It started with Tanstack Query, which adopted Nx and Nx Cloud. Zack talked about this collab with Dominik, and we also had Dominik on our Nx live stream. Now, all the above-mentioned Tanstack libs have adopted Nx, and there's more coming.

If you want to bring your own UI, TanStack Table (formerly React Table) [0], if you want something that's batteries included, MUI [1]. There are of course other options with either close or full feature parity, but these are the two I see most often with least pain across different companies. While we're on the topic of recommendations, avoid any- and everything by Telerik.

[0] https://tanstack.com/table/

[1] https://mui.com/material-ui/react-table/

Happy to help, here's one for next time you need tables: https://github.com/TanStack/table

Or for the table react-table can be a powerful option to consider.

svelte-headless-table: Unopinionated and extensible data tables for Svelte. (I haven't tried tanstack-table, but I've heard good things about it)

solution

For this week's pick, I chose TanStack Table, a table-building solution that offers power and flexibility. This headless UI solution provides a lightweight and agnostic core, making it easy to integrate into any React, Solid, Vue, Svelte, or TS/JS project.