At a Glance:
Refine CORE is an open-source React meta-framework for building CRUD-heavy enterprise applications, providing a headless architecture, built-in connectors for 15+ backend services, and decoupled business logic for custom UIs and platforms like Next.js and Remix.
Overview:
Refine CORE is a React meta-framework designed for data-intensive, CRUD-heavy web applications. It targets enterprise use cases such as internal tools, admin panels, dashboards, and B2B apps, but its built-in SSR support also extends its use to customer-facing storefronts. The framework offers hooks and components that streamline development with industry-standard solutions for authentication, access control, routing, networking, state management, and i18n. Its headless architecture decouples business logic from the UI, allowing developers to integrate any custom design or UI framework like TailwindCSS, Material UI, and Ant Design, and deploy to various platforms via a simple routing interface.
Key Decision Points:
Headless architecture with UI decoupling: Business logic is separated from the UI and routing, which allows integration with any custom CSS (like TailwindCSS) or component library (like Material UI, Ant Design, Mantine, Chakra UI).
Backend and data source flexibility: Provides connectors for 15+ backend services, including REST APIs, GraphQL, Supabase, Appwrite, Hasura, and Strapi, among others.
Platform and routing support: Supports deployment on platforms like Next.js, Remix, React Native, and Electron through a simple routing interface, with built-in SSR support for Next.js and Remix.
Targeted for specific application types: Explicitly designed for data-intensive enterprise B2B apps, admin panels, dashboards, and internal tools, but also capable of powering customer-facing applications like storefronts.
Integrated development solutions: Comes with hooks and components for common cross-cutting concerns like authentication, access control, i18n, and state management via React Query.
Core Features:
15+ backend service connectors: Offers out-of-the-box data providers for services such as REST API, GraphQL, Supabase, Appwrite, Hasura, Firebase, and Directus.
Auto-generation of CRUD UIs: Can automatically generate CRUD interfaces based on an API's data structure.
Built-in state management and mutations: Uses React Query for server state management, caching, and data mutations.
Authentication and access control providers: Seamlessly integrates authentication and role-based access control flows.
Refine CORE Devtools: An included development tool that provides insights into the application for debugging and optimization.
SSR and routing: Built-in support for server-side rendering with Next.js and Remix, and advanced routing that works with any router library.
Use Cases:
Building internal tools and admin panels that require a highly customizable UI disconnected from pre-built libraries.
Developing data-intensive B2B applications that need to connect to various backend services like Supabase, Strapi, or Hasura through a single interface.
Creating both enterprise dashboards and customer-facing storefronts that benefit from server-side rendering on Next.js or Remix.
Starting a project with live/real-time features, audit logs, and document versioning enabled by the framework's built-in support.
Open-Source Alternative Value:
Refine CORE operates as an open-source meta-framework that provides a headless, connector-based approach for React-based enterprise applications. Its value lies in the explicit decoupling of business logic from UI and routing, allowing developers to avoid lock-in to a specific component library or platform. By offering pre-built hooks for authentication, access control, and state management alongside connectors for more than 15 popular backend services, it serves as a structured, non-proprietary foundation that can be customized with any design system and deployed across web, mobile, and desktop environments without additional configuration steps.
