Mobile example
Build an exercise app with React Native
An Expo Router demo that turns the public RepDB snapshot into a native-feeling iOS, Android, and web catalog.
Public repository · No API key required · Commercial in-app use with attribution
Integration walkthrough
How to bundle RepDB in a React Native exercise app
The Expo app imports the exercise JSON as a local module and uses a generated static image map that Metro can bundle reliably. A FlatList renders the catalog efficiently, while Expo Router opens detail screens by stable exercise slug.
- 1 Bundle exercises.json with the application instead of requesting an API at runtime.
- 2 Generate a static require map for WebP assets so Metro can include every referenced image.
- 3 Render and sort the local collection with FlatList for predictable mobile performance.
- 4 Navigate to typed exercise detail screens through Expo Router slug parameters.
Key files in the repository
- assets/exercises.json — Bundled public exercise snapshot
- lib/bundle.ts — Typed data and localization helpers
- scripts/gen-images.cjs — Metro-compatible static image-map generator
- app/index.tsx — FlatList catalog and Expo Router navigation
import bundleJson from '../assets/exercises.json';
export const EXERCISES =
(bundleJson as Bundle).exercises;
<FlatList
data={sorted}
keyExtractor={(exercise) => exercise.id}
renderItem={({ item }) => (
<ExerciseListItem exercise={item} />
)}
/> What it demonstrates
A practical starting point, not a toy snippet
The example generates a local image map before launch, then renders the bundled dataset through Expo Router. Use the same pattern when you want an app that remains usable offline.
- Runs on iOS, Android, and the web from one codebase
- Fast catalog rendering with FlatList and stable slug navigation
- Bundled WebP exercise images with no runtime API dependency
- Light and dark themes ready for product customization
Sample vs full dataset
Prototype publicly. Ship with the complete library.
The repository deliberately uses a limited public snapshot. It shows the integration without publishing the full paid RepDB catalog.
Included in the public example
- 400 exercise records
- Flat 512px WebP images
- English, German, and Spanish content
- One paid-animation preview
Available in paid RepDB plans
- The complete, growing exercise catalog
- Classic and flat images up to 1024px
- Transparent assets and exercise animations on Standard
- SQLite, TypeScript, embeddings, and integration templates on Standard
Need another stack?
Browse the other examples or use the same local-data pattern in your own framework.