Refine Dev

Refine is a headless React framework that handles the plumbing for admin panels and CRUD apps so you don't have to wire up data fetching, routing, and auth yourself. It gives you hooks like useList, useTable, and useForm that work with any backend through data provider adapters (REST, GraphQL, Supabase, whatever). The 5.0.12 release fixed how useList preserves custom fields from your API, which matters if you're sending back aggregates or metadata. It's UI-agnostic but integrates cleanly with Mantine or Ant Design. The big win is that it enforces a resource-based architecture, so your CRUD apps stay consistent instead of turning into a pile of one-off components. Best for internal tools and dashboards where you want structure without a full backend framework.

skills.sh installs: 208
GitHub stars: 23
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add itechmeat/llm-code --skill refine-dev --agent claude-code

Installs into .claude/skills of the current project.

Files

Refine.dev Framework

Refine is a headless React framework for building enterprise CRUD applications. It provides data fetching, routing, authentication, and access control out of the box while remaining UI-agnostic.

Core Concepts

Refine is built around these key abstractions:

Data Provider — adapter for your backend (REST, GraphQL, etc.)
Resources — entities in your app (e.g., posts, users, products)
Hooks — useList, useOne, useCreate, useUpdate, useDelete, useForm, useTable
Auth Provider — handles login, logout, permissions
Router Provider — integrates with React Router, etc.

Quick Start (Vite)

Scaffold: npm create refine-app@latest (select Vite, Mantine, REST API). For manual setup, install @refinedev/core @refinedev/mantine @refinedev/react-router and Mantine packages.

Minimal App Structure

// src/App.tsx
import { Refine } from "@refinedev/core";
import { MantineProvider } from "@mantine/core";
import routerProvider from "@refinedev/react-router";
import dataProvider from "@refinedev/simple-rest";
import { BrowserRouter, Routes, Route } from "react-router-dom";

SKILL.md on GitHub