Repolode
Enviar
refinedev

refinedev/refine

Um meta-framework headless para React, voltado à criação de painéis administrativos, dashboards e ferramentas internas com muito CRUD.

Alternativa open source a:RetoolAppsmith

Ver no GitHubSite
Estrelas
35,913
Forks
3,251
Issues abertas
49
Último commit
mês passado

O que é?

Refine é um meta-framework para React voltado a aplicações web com muito CRUD, como painéis administrativos, dashboards, ferramentas internas e apps B2B. Ele fica entre os construtores low-code e a criação de tudo do zero: seus hooks e componentes cuidam de questões comuns, como autenticação, controle de acesso, roteamento, busca de dados, gerenciamento de estado e i18n, enquanto você mantém a liberdade de escolher a interface.

Como o core é headless, a lógica de negócios fica desacoplada da apresentação. O framework oferece suporte integrado a Ant Design, Material UI, Mantine e Chakra UI, além de poder ser usado com designs personalizados, como os feitos com Tailwind CSS. O roteamento é abstraído por uma interface de router, o que permite usar Next.js, Remix, React Router e React Native. Também inclui suporte a SSR para Next.js e Remix.

O acesso a dados é feito por meio de conectores para mais de 15 backends, incluindo REST APIs, GraphQL, NestJS CRUD, Supabase, Strapi, Hasura, Appwrite, Firebase, Sanity e Directus. O gerenciamento de dados é baseado em React Query.

Recursos principais

  • 01Hooks e componentes headless para autenticação, controle de acesso, roteamento, comunicação com redes e i18n
  • 02Conectores para mais de 15 backends, como REST, GraphQL, Supabase, Strapi e Firebase
  • 03Suporte integrado a Ant Design, Material UI, Mantine e Chakra UI, além de opções de estilização personalizada
  • 04Suporte a SSR com Next.js e Remix, com roteamento compatível com várias bibliotecas de router
  • 05Busca e mutações de dados baseadas em React Query, além de suporte a dados ao vivo/em tempo real

Casos de uso

  • Criar ferramentas internas e painéis administrativos sobre uma API REST ou GraphQL existente
  • Criar dashboards B2B com controle de acesso baseado em funções
  • Prototipar rapidamente apps CRUD usando uma biblioteca de UI existente, como Ant Design ou MUI
  • Criar apps voltados a clientes e com grande volume de dados, como lojas virtuais com SSR

Início rápido

  1. 1

    Crie um novo projeto com o scaffolder create-refine-app

    npm create refine-app@latest my-refine-app

Antes de usar

  • Para usar a ferramenta de forma eficaz, é necessário conhecer uma stack baseada em React e TypeScript.
  • A ferramenta é baseada no React Query e em padrões CRUD, por isso é menos adequada para aplicativos que não sejam CRUD.

Tópicos

#react#crud#admin-panel#dashboard#headless#typescript#internal-tools#react-query#admin#admin-ui

Perguntas frequentes

O que é refine?
Um meta-framework headless para React, voltado à criação de painéis administrativos, dashboards e ferramentas internas com muito CRUD. Refine é um meta-framework para React voltado a aplicações web com muito CRUD, como painéis administrativos, dashboards, ferramentas internas e apps B2B. Ele fica entre os construtores low-code e a criação de tudo do zero: seus hooks e componentes cuidam de questões comuns, como autenticação, controle de acesso, roteamento, busca de dados, gerenciamento de estado e i18n, enquanto você mantém a liberdade de escolher a interface.
refine é gratuito? Qual é a licença?
refine é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
refine ainda é mantido?
Atualizado nos últimos 6 meses. O último commit de refine foi em 10 de set. de 2026.
Para que posso usar refine?
Criar ferramentas internas e painéis administrativos sobre uma API REST ou GraphQL existente Criar dashboards B2B com controle de acesso baseado em funções Prototipar rapidamente apps CRUD usando uma biblioteca de UI existente, como Ant Design ou MUI Criar apps voltados a clientes e com grande volume de dados, como lojas virtuais com SSR
Como instalar refine?
Crie um novo projeto com o scaffolder create-refine-app: npm create refine-app@latest my-refine-app
Onde consigo refine?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/refinedev/refine

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados