# Expo adapter examples

import { Card, CardGrid } from '@astrojs/starlight/components';
import { Image } from 'astro:assets';
import { contribExamplesUrl, expoExamples, getExampleDemoLinks } from '../../../data/examples.ts';

# Expo Adapter Examples

Examples using `@livestore/adapter-expo` for React Native mobile applications.

<CardGrid>
{expoExamples.map((example) => {
  const { url, label } = getExampleDemoLinks(example);

  return (
    <Card title={example.title} key={example.title}>
    {example.image ? (
      <Image src={example.image} alt={`${example.title} application interface`} />
    ) : (
      <div style="background: linear-gradient(135deg, #1f2937 0%, #374151 100%); height: 200px; display: flex; align-items: center; justify-content: center; color: #9ca3af; font-size: 14px; border-radius: 8px;">
        Screenshot coming soon
      </div>
    )}
    <p>{example.description}</p>
    <p><strong>Technologies:</strong> {example.technologies.join(' • ')}</p>
    {example.syncProvider && (
      <p><strong>Sync Provider:</strong> {example.syncProvider}</p>
    )}
    <div style="margin-top: auto; padding-top: 1rem;">
      {url && (
        <p style="margin: 0 0 0.5rem 0;"><a href={url} target="_blank" rel="noopener noreferrer">{label}</a></p>
      )}
      <p style="margin: 0;"><a href={example.sourceUrl} target="_blank" rel="noopener noreferrer">View Source →</a></p>
    </div>
    </Card>
  );
})}
</CardGrid>

## Expo Adapter

- Uses native Expo SQLite stored in device's SQLite directory
- Requires New Architecture (Fabric) - incompatible with old architecture
- Single-threaded operation in main thread
- WebSocket connections for sync via React Native dev server

---
<a href={contribExamplesUrl}>View all examples on GitHub →</a>