data-fetching-architecture
LobeHub data-fetching pipeline guide. Use for service layer, Zustand store, SWR, lambdaClient, useClientDataSWR, useFetchXxx hooks, or migrating useEffect fetches.
Install
git clone https://github.com/lobehub/lobehub /tmp/lobehub && ln -s /tmp/lobehub/.agents/skills/data-fetching-architecture ~/.claude/skills/data-fetching-architectureFrom README
LobeHub Data Fetching Architecture Related: store-data-structures covers List vs Detail data shape rationale (Map vs Array). Architecture Overview Core Principles ✅ DO Use Service Layer for all API calls Use Store SWR Hooks for data fetching (not useEffect) Use proper data structures — see store-data-structures skill for List vs Detail patterns Use lambdaClient.mutate for write operations (create/update/delete) Use lambdaClient.query only inside service methods Naming convention — read hooks are useFetchXxx, cache invalidation helpers are refreshXxx (e.g. useFetchBenchmarks / refreshBenchmarks). Mutations then chain refreshXxx() after the service call.
More from this repo
zustand
Use for Zustand stores: state shapes and type sources, state-only stores with xActions classes, replica-backed...
add-setting-env
Used to add server-side environment variables that control default values for user settings.
debug-package
Use for debug() logging, lobe-* namespaces, DEBUG/localStorage.debug configuration and log formatting.