Replacing Kendo MVC with React: The Options
You asked "what to use that is ready-made" or "React-based" to replicate Kendo. Here are the viable paths, divided by philosophy.
Option 1: "I want everything ready" (Admin/CRUD Frameworks)
This is the closest answer to your request for "something ready-made". Instead of assembling grids and buttons by hand, you use a framework that already gives you pagination, filters, and forms.
1. Refine (refine.dev) - ⭐ Recommended
It is a "meta-framework" for B2B applications.
- Why we like it: It is "Headless". It means it handles all the "boring" logic (API calls, state, filters, auth) but lets you use the graphics library you want (Ant Design, Material UI, Mantine).
- Pros:
- Very generous Open Source (many "Enterprise" features are free).
- Total flexibility: if one day you want to change graphics, the logic remains.
- .NET Integration: Easily connects to your existing WebAPI APIs.
- Cons: Initial learning curve to understand its "Hooks".
2. React Admin (marmelab.com)
The veteran of the sector.
- Why we like it: Very mature, extremely stable. If you need to make simple CRUD tables it is very fast.
- Pros: Excellent documentation, vast ecosystem.
- Cons: Very "opinionated" (uses Material UI). Heavy customization is harder than Refine. Some advanced features (like in-cell editing or complex trees) are in the paid Enterprise version.
Option 2: "I build it myself, but I want top components" (Component Suites)
If you prefer to have total control of the layout and insert the grid "where you want" (as you do now with MVC), you need Enterprise React components.
1. KendoReact (Telerik)
- Philosophy: "Let's keep it in the family".
- Advantages:
- Look & Feel identical (or very similar) to the current one.
- Features are 1:1 with those used in MVC (Grid, Scheduler, Charts).
- Telerik Support (which you already know/pay for).
- Disadvantages: You have to rewrite Views from scratch (no automatic migration), but conceptually you will find the same parameters.
2. AG Grid
- Philosophy: "Brute performance".
- Advantages: It is the de-facto standard for complex grids (Excel-like). Handles millions of rows without blinking.
- Disadvantages:
- Expensive. The features you use (Grouping, Pivot, Excel Export) are in the "Enterprise" license (~$999/dev/year).
- It is "just" a grid. For forms, buttons, dates, you need to integrate it with something else (e.g., React Hook Form + a UI lib).
3. MUI X (Material UI)
- Philosophy: "Consistent Google Design".
- Advantages: Beautiful if you like Material Design. Excellent Developer Experience.
- Disadvantages: Here too, "Pro" features (Grouping, Pinning) are paid.
Quick Comparison Table
| Feature | Refine.dev | React Admin | KendoReact | AG Grid |
|---|---|---|---|---|
| Type | Full Framework | Full Framework | UI Library | Grid Component |
| "Ready-made" | ✅ High | ✅ Very High | ❌ Medium (Must assemble) | ❌ Low (Grid Only) |
| Backend | Agnostic (Ok .NET) | Agnostic (Ok .NET) | Agnostic | Agnostic |
| License Cost | Open Source (MIT) | Free + Enterprise | Commercial | Free + Enterprise |
| Look | Customizable (AntD/MUI) | Material Design | Kendo Theme | Excel-like / Neutral |
The Verdict for OMGT
- If you want to quickly modernize standard processes (CRUD master data tables, simple lists): Go with Refine. It gives you the "ready-made" structure and removes the boilerplate thought, maintaining design freedom.
- If
OrderMGTis too complex/custom (e.g., that "LightIndex" screen with strange logic injected by the server): You probably need a pure UI Library like KendoReact. It will allow you to rebuild the UI exactly as you need it, piece by piece, without the constraints of an "admin" framework.
Hybrid Strategy: Use Refine for 90% of the "boring" backoffice pages (InboundMGT, master data) and use "pure" React components (maybe even KendoReact integrated inside Refine!) for super-complex screens like "Order Detail".