Agent skill

offline-first

Local storage, data sync, and conflict resolution for offline-capable apps.

Stars 0
Forks 0

Install this agent skill to your Project

npx add-skill https://github.com/timequity/vibe-coder/tree/main/skills/mobile/offline-first

SKILL.md

Offline-First

Storage Options

Option Use Case
AsyncStorage Simple key-value
MMKV Fast key-value
SQLite Complex queries
WatermelonDB Large datasets, sync

MMKV (Recommended)

typescript
import { MMKV } from 'react-native-mmkv';

const storage = new MMKV();

// Store
storage.set('user', JSON.stringify(user));
storage.set('token', 'abc123');

// Retrieve
const user = JSON.parse(storage.getString('user') || '{}');
const token = storage.getString('token');

// Delete
storage.delete('token');

Sync Strategy

Optimistic Updates

typescript
async function updateItem(id: string, data: Partial<Item>) {
  // 1. Update local immediately
  await localDb.update(id, { ...data, _synced: false });

  // 2. Update UI
  queryClient.setQueryData(['item', id], (old) => ({
    ...old,
    ...data,
  }));

  // 3. Sync to server
  try {
    await api.updateItem(id, data);
    await localDb.update(id, { _synced: true });
  } catch (error) {
    // Queue for retry
    await syncQueue.add({ type: 'update', id, data });
  }
}

Background Sync

typescript
import NetInfo from '@react-native-community/netinfo';

NetInfo.addEventListener((state) => {
  if (state.isConnected) {
    syncQueue.processAll();
  }
});

Conflict Resolution

typescript
// Last-write-wins
if (serverItem.updatedAt > localItem.updatedAt) {
  await localDb.update(id, serverItem);
} else {
  await api.updateItem(id, localItem);
}

// Or: Manual resolution
if (hasConflict) {
  showConflictResolver(serverItem, localItem);
}

Network Status

typescript
function useNetworkStatus() {
  const [isOnline, setIsOnline] = useState(true);

  useEffect(() => {
    return NetInfo.addEventListener((state) => {
      setIsOnline(state.isConnected ?? false);
    });
  }, []);

  return isOnline;
}

Expand your agent's capabilities with these related and highly-rated skills.

timequity/vibe-coder

mvp-help

Help and documentation for Idea to MVP plugin. Use when: user asks about building MVPs, vibe coding, or available commands. Triggers: "help", "what can you do", "mvp help", "how to build".

0 0
Explore
timequity/vibe-coder

verification-gate

Hidden quality gate that runs before showing "Done!" to user - ensures all tests pass, build succeeds, and requirements met before claiming completion

0 0
Explore
timequity/vibe-coder

brainstorming

Refine ideas into detailed designs through Socratic dialogue. Use when: user has rough idea, needs to clarify requirements, explore approaches. Triggers: "brainstorm", "discuss idea", "I'm thinking about", "what if", "help me think through", "explore options", "/brainstorm".

0 0
Explore
timequity/vibe-coder

subagent-creator

Guide for creating effective subagents (custom agents). Use when users want to create a new subagent that can be dispatched via Task tool for autonomous work. Covers frontmatter fields (name, description, tools, model, permissionMode, skills), prompt design, and when to use subagents vs skills.

0 0
Explore
timequity/vibe-coder

backend-rust

Modern Rust backend with Axum, SQLx, tokio + CI/CD automation. Use when: building Rust APIs, high-performance services, or needing build/test/lint/audit automation. Triggers: "axum", "rust backend", "rust api", "sqlx", "tokio", "cargo build", "cargo test", "clippy", "rustfmt", "cargo-audit", "cross-compile", "rust ci", "release build", "rust security", "shuttle", "actix".

0 0
Explore
timequity/vibe-coder

test-driven-development

Write failing test first, then minimal code to pass. Red-Green-Refactor cycle. Use when: implementing features, fixing bugs, refactoring code. Triggers: "implement", "add feature", "fix bug", "tdd", "test first", "write tests", "test-driven".

0 0
Explore

Didn't find tool you were looking for?

Be as detailed as possible for better results