mobile-starter-expo — Starter Pack

Expo/React Native app with basic screens, API client, and offline cache (AsyncStorage).
Updated: 9 Oct 2025

This repository is a starter pack. Don’t clone it for your project.
Create your own repository from this template, or bootstrap from scratch using the steps below.

---

Option A — Use as a GitHub Template (recommended)

1. Click Use this template → Create a new repository in your org/user.
2. Clone your new repository.
3. Follow Run locally and Build below.

---

Option B — Create from scratch

# 1) Project
npx create-expo-app@latest my-app
cd my-app

# 2) Offline cache
npm i @react-native-async-storage/async-storage

# 3) Minimal API client
mkdir -p lib && cat > lib/api.ts <<'TS'
export async function getHealth() {
  const base = process.env.EXPO_PUBLIC_API_URL || "";
  const res = await fetch(base + "/health");
  if (!res.ok) throw new Error("health failed");
  return res.json();
}
TS

# 4) Example screen
mkdir -p app && cat > app/index.tsx <<'TSX'
import { useEffect, useState } from "react";
import { View, Text, Button } from "react-native";
import AsyncStorage from "@react-native-async-storage/async-storage";
import { getHealth } from "../lib/api";

export default function Home() {
  const [status, setStatus] = useState<string>("checking...");
  useEffect(() => {
    getHealth()
      .then((d) => setStatus(d.ok ? "ok" : "not ok"))
      .catch(() => setStatus("error"));
  }, []);

  return (
    <View style={{ flex:1, alignItems:"center", justifyContent:"center", gap: 8 }}>
      <Text style={{ fontSize: 20, fontWeight: "600" }}>Since AI Mobile Starter</Text>
      <Text testID="status">/health: {status}</Text>
      <Button
        title="Save offline"
        onPress={async () => { await AsyncStorage.setItem("demo", new Date().toISOString()); }}
      />
    </View>
  );
}
TSX

# 5) Env file
cat > .env.example <<'ENV'
# e.g. http://localhost:8000 (FastAPI) or http://localhost:3000 (Next.js)
EXPO_PUBLIC_API_URL=http://localhost:8000
ENV

---

Run locally

cp .env.example .env            # then edit as needed
npm install
npm run start                   # opens Expo Dev Tools
# press i for iOS Simulator (macOS), a for Android emulator, or scan QR for device

If calling a local API from a device/emulator, use your LAN IP instead of localhost in EXPO_PUBLIC_API_URL.

---

Minimal project structure

app/
  index.tsx          # home screen
lib/
  api.ts             # API client (health check)
.env.example

---

Build

• Local dev: npm run start
• Android/iOS builds (optional): use EAS (npx expo install expo-dev-client then eas build -p android|ios).
• Set EXPO_PUBLIC_API_URL in your build profile/environment.

Health check: requests GET <EXPO_PUBLIC_API_URL>/health → expects { "ok": true }

---

Notes

• Keep pull requests small; use Conventional Commits.
• Do not commit secrets; use .env locally and platform envs in CI/build.
• For production, add error handling, navigation, theming, and auth when needed.

License: MIT