native-data-fetching

Implement network requests, caching, and offline support in Expo and React Native apps.

Updated Mar 29, 2026
One-click install
npx skills add https://github.com/Divith123/Flamingo --skill native-data-fetching-divith123
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: native-data-fetching
Source: https://github.com/Divith123/Flamingo/tree/main/.agents/skills/native-data-fetching
Command: npx skills add https://github.com/Divith123/Flamingo --skill native-data-fetching-divith123

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @tanstack/react-query, expo-secure-store, @react-native-community/netinfo, expo-router, expo-server, and includes references (resource) components.

What problem does it solve? Building reliable networking in React Native and Expo apps involves many pitfalls: unhandled fetch errors, insecure token storage, missing retry logic, and broken offline behavior. This Skill provides proven patterns for data fetching, caching, authentication, and environment configuration so you avoid common mistakes. ## Core Features & Use Cases - Fetch & Error Handling: Typed API errors, exponential backoff retries, and request cancellation with AbortController. - React Query Integration: Setup, queries, mutations, cache invalidation, and offline-aware syncing with NetInfo. - Auth & Security: Token storage with expo-secure-store and token refresh flows. - Environment Config: EXPO_PUBLIC_ environment variables for dev/prod API URLs with TypeScript typing. - Expo Router Loaders: Route-level server data loading for web (SDK 55+) via the references guide. - Use Case: You need your Expo app to fetch user data, cache it for offline use, and attach a securely stored auth token to every request—this Skill gives you the complete implementation pattern. ## Quick Start Ask the AI to implement a cached, authenticated API request with error handling and offline support in your Expo app.

Frequently Asked Questions about native-data-fetching

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I make API calls in React Native with fetch?▼

Use the fetch API with async/await and always check response.ok before parsing JSON. Wrap requests in a helper that throws typed errors for HTTP failures and network issues, and prefer expo/fetch over axios in Expo projects.

Should I use React Query or SWR for data fetching?▼

React Query (TanStack Query) suits complex apps needing caching, mutations, invalidation, and offline persistence. SWR or custom hooks work for simpler needs. React Query also handles request deduplication and cancellation automatically.

How do I store authentication tokens securely in Expo?▼

Store tokens with expo-secure-store, not AsyncStorage, which is unencrypted. Implement a refresh flow that deduplicates concurrent refresh attempts, and attach tokens via an authenticated fetch wrapper that adds the Authorization header.

How do I configure different API URLs for development and production in Expo?▼

Define EXPO_PUBLIC_API_URL in .env.development and .env.production files; Expo inlines EXPO_PUBLIC_ variables at build time. Never put secrets in EXPO_PUBLIC_ variables since they ship in the client bundle—use non-prefixed variables in server code only.

Can Expo Router loaders be used on native platforms?▼

No, Expo Router data loaders are web-only and require SDK 55+ with server or static web output. For native platforms, use client-side fetching with React Query or fetch instead.

How do I add offline support to React Native data fetching?▼

Use @react-native-community/netinfo to monitor connectivity and connect it to React Query's onlineManager so queries pause offline and resume when the network returns. Combine with React Query persistence for cached data across sessions.