skills.rest
elcokiin
elcokiinCOMMUNITY
Explore all skills by this author →
Website𝕏@elcokiinGitHub

native-data-fetching

Implements network requests, caching, and offline handling for Expo and React Native apps.

Updated Mar 19, 2026
Search Tags:#authentication#data fetching#react native#api client#react query#expo#offline support
One-click install
npx skills add https://github.com/elcokiin/vibe-tribe --skill native-data-fetching-elcokiin
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: native-data-fetching
Source: https://github.com/elcokiin/vibe-tribe/tree/main/.agents/skills/native-data-fetching
Command: npx skills add https://github.com/elcokiin/vibe-tribe --skill native-data-fetching-elcokiin

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 API requests, caching, authentication, and offline support so your app's data layer works correctly across web and native platforms. ## Core Features & Use Cases - Fetch & Error Handling: Typed API errors, exponential backoff retries, and request cancellation with AbortController. - React Query Integration: Query client setup, mutations, cache invalidation, and offline-aware synchronization with NetInfo. - Authentication & Security: Token storage with expo-secure-store and token refresh flows that avoid race conditions. - Environment Configuration: EXPO_PUBLIC_ environment variables for per-environment API URLs, with guidance on keeping secrets out of the client bundle. - Expo Router Loaders: Route-level server data loading for web (SDK 55+) via the references guide. - Use Case: You are building an Expo app that calls a Hono backend. Use this Skill to set up an authenticated API client with React Query caching, offline detection, and separate dev/prod API URLs. ## Quick Start Ask the AI to set up data fetching in your Expo app, for example: "Add an authenticated API client with React Query and offline support to my 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 explicit error handling: check response.ok before parsing JSON and throw typed errors for HTTP failures. Wrap requests in a helper that adds authentication headers and handles network errors separately from HTTP errors.

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

React Query (TanStack Query) suits complex apps needing mutations, cache invalidation, and offline persistence. SWR fits simpler needs with lighter configuration. React Query also integrates with NetInfo to pause queries when the device goes offline.

How do I store authentication tokens securely in Expo?▼

Store tokens with expo-secure-store, not AsyncStorage, which is unencrypted. Implement a token refresh flow that deduplicates concurrent refresh attempts using a shared promise, then attach tokens via an authenticated fetch wrapper.

Can I use Expo Router loaders on native platforms?▼

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

Why is my EXPO_PUBLIC environment variable undefined?▼

EXPO_PUBLIC_ variables are inlined at build time, so you must restart the dev server after editing .env files. Only variables with the EXPO_PUBLIC_ prefix are exposed to the client bundle; never put secrets in them since they ship with the app.

How do I add offline support to React Native API calls?▼

Use @react-native-community/netinfo to track connectivity and connect it to React Query via onlineManager so queries pause offline and resume when the network returns. Combine with query persistence for an offline-first experience.

Related Skills

Explore More Software Engineering Skills→
zap-studiozap-studio

fetch

Validate HTTP API responses against Standard Schema with typed inference.

Official
Intermediate
hq-opensourcehq-opensource
7

react-ui-patterns

Audit React components for loading, error, empty, and button-state issues.

Official
Intermediate
IgorGanapolskyIgorGanapolsky
38

Error Handling Protocols

Diagnose and recover from API failures and infrastructure issues in trading systems.

Community
Advanced
bobmatnycbobmatnyc
68

trpc-type-safety

Create end-to-end type-safe APIs in TypeScript with tRPC.

Community
Advanced