Documentation

Quick Start

Get up and running in minutes

Learn how to set up Qortex in your React application and start fetching data immediately.

Getting Started

Prerequisites

Make sure you have React 18+ and Node.js 16+ installed.

Get up and running with Qortex in minutes with this quick start guide.

1. Installation

Install the required packages:

1. Installation

# npm
npm install qortex-query qortex-query-react


# yarn
yarn add qortex-query qortex-query-react


# pnpm
pnpm add qortex-query qortex-query-react

2. Basic Setup

Create your first query with useQuery:

2. Basic Setup

import { useQuery } from 'qortex-query-react';


function UserProfile({ userId }: { userId: string }) {
  const { data, isLoading, error } = useQuery(
    ['user', userId],
    {
      fetcher: async () => {
        const response = await fetch(`/api/users/${userId}`);
        return response.json();
      }
    }
  );


  if (isLoading) return <div>Loading...</div>;
  if (error) return <div>Error: {error.message}</div>;
  
  return <div>Hello, {data.name}!</div>;
}

3. Advanced Configuration

Set up global defaults and advanced options:

3. Advanced Configuration

import { setDefaultConfig } from 'qortex-query';


// Set global defaults
setDefaultConfig({
  staleTime: 5 * 60 * 1000, // 5 minutes
  refetchOnSubscribe: 'stale'
});


// Use with custom options
const { data } = useQuery(
  'products',
  {
    fetcher: fetchProducts,
    staleTime: 10 * 60 * 1000, // 10 minutes
    refetchOnSubscribe: 'always'
  }
);

Related Pages

installationuseQueryuseQueryData