Skip to main content

​
What is a Data Provider?

A data provider is a bridge between your Refine application and your backend service. It provides a standardized interface for performing CRUD operations (Create, Read, Update, Delete) on your data, regardless of the backend API structure. Refine’s data provider architecture allows you to:
  • Connect to any backend service with a consistent API
  • Switch between different backends without changing your application code
  • Use multiple data providers in a single application
  • Customize data provider behavior for specific use cases

​
Core Methods

Every data provider implements the following core methods:

​
Reading Data

  • getList: Fetch a list of records with pagination, sorting, and filtering
  • getOne: Fetch a single record by ID
  • getMany: Fetch multiple records by their IDs

​
Writing Data

  • create: Create a new record
  • update: Update an existing record
  • deleteOne: Delete a single record

​
Optional Methods

  • createMany: Create multiple records in a single request
  • updateMany: Update multiple records in a single request
  • deleteMany: Delete multiple records in a single request
  • custom: Execute custom operations on your API
  • getApiUrl: Get the base URL of your API

​
Available Data Providers

Refine provides official data providers for popular backend services:

Simple REST

Connect to REST APIs following json-server conventions

GraphQL

Build applications with GraphQL APIs

Supabase

Open source Firebase alternative with PostgreSQL

Strapi

Headless CMS for building APIs

Hasura

Instant GraphQL on your databases

NestJS Query

GraphQL data provider for NestJS Query

Appwrite

Open source backend platform

Airtable

Cloud-based relational database platform

Medusa

Open source commerce platform

Firebase

Google’s mobile and web app platform

​
Basic Usage

To use a data provider, pass it to the dataProvider prop of the <Refine> component: 
import { Refine } from "@refinedev/core";
import dataProvider from "@refinedev/simple-rest";

const App = () => {
  return (
    <Refine
      dataProvider={dataProvider("https://api.example.com")}
      // ... other props
    >
      {/* Your app content */}
    </Refine>
  );
};

​
Multiple Data Providers

You can use multiple data providers in a single application by passing an object with named data providers: 
import { Refine } from "@refinedev/core";
import restDataProvider from "@refinedev/simple-rest";
import graphqlDataProvider from "@refinedev/graphql";

const App = () => {
  return (
    <Refine
      dataProvider={{
        default: restDataProvider("https://api.example.com"),
        graphql: graphqlDataProvider(client),
      }}
      // ... other props
    >
      {/* Your app content */}
    </Refine>
  );
};
Then specify which data provider to use in your resource configuration: 
resources={[
  {
    name: "posts",
    // Uses default data provider
  },
  {
    name: "users",
    meta: {
      dataProviderName: "graphql",
    },
  },
]}

​
Next Steps

Creating a Custom Provider

Learn how to build your own data provider

Choose Your Provider

Explore available data providers

Build docs developers (and LLMs) love

Get started for freeTalk to us