Templates

Choose the right template for your project. Each template generates code optimized for a specific data fetching library with the group-hooks structure (api.ts + hooks.ts).

TanStack Query (Recommended)

Modern, powerful data synchronization library with excellent TypeScript support and automatic caching.

Generated Code Example

Features

• Automatic background refetching
• Query deduplication and caching
• Optimistic updates support
• Infinite scroll queries
• Server-side rendering support
• Query key factory pattern

RTK Query

Official Redux Toolkit data fetching solution with powerful caching and state management.

Generated Code Example

Features

• Integrated with Redux DevTools
• Automatic cache management
• Polling and real-time updates
• Optimistic updates
• Code splitting support
• Auto-generates src/services/config.ts

SWR

Lightweight data fetching library by Vercel with stale-while-revalidate strategy.

Generated Code Example

Features

• Fast, lightweight, and reusable
• Built-in cache and request deduplication
• Real-time experience
• Pagination and infinite loading
• SSR and SSG support

React Query Kit

Enhanced TanStack Query experience with improved type inference and DX.

Generated Code Example

Features

• Enhanced type safety
• Simplified API surface
• Better DX with less boilerplate
• Built on TanStack Query

Basic (useState/useEffect)

Simple implementation without external dependencies for learning or simple projects.

Generated Code Example

Features

• No external dependencies
• Simple and straightforward
• Great for learning React patterns
• Minimal bundle size

File Structure

All templates use the group-hooks structure, which organizes code by feature/tag:

HTTP Clients & Validators

All templates support customization:

HTTP Clients

• axios (default) - Full-featured with interceptors
• fetch - Native browser API, smaller bundle

Schema Validators

• zod (default) - TypeScript-first validation
• yup - Popular schema builder