Browse docs
Make It Yours

Make It Yours

Rename the app, change the colours and icon, and delete the demo screens so what is left is your product.

Updated Aug 2026
On this page

The demo screens exist to show you what is wired up. Once you have looked, replace them. Do these in order.

1. Name the app

Open apps/mobile/app.json and set:

{
  "expo": {
    "name": "Your App Name",
    "slug": "your-app-name",
    "scheme": "yourapp",
    "ios": { "bundleIdentifier": "com.yourcompany.yourapp" },
    "android": { "package": "com.yourcompany.yourapp" }
  }
}

Set the identifiers before your first build

bundleIdentifier and package are how the stores identify your app forever. Changing them later means a new listing and losing your existing installs. Pick them now, even if the name changes later.

scheme is your deep-link prefix, the yourapp:// part.

2. Set your colours

The Profile screen of the running app, showing account details, an appearance section with a theme control, a language control, and account actions
The Profile screen before you touch anything. Nothing on it carries a hard-coded colour, which is what makes the two variable blocks below worth editing.

Theme colours live as CSS variables in apps/mobile/global.css, in the shadcn convention: a light block and a dark block, each with --primary, --background, --foreground, and friends.

Change --primary in both blocks and every button, link, and accent follows. You do not need to touch any component.

3. Icon and splash screen

Replace the images in apps/mobile/assets/, keeping the same filenames and sizes. docs/recipes/app-icons-and-splash.md lists exactly which files and dimensions the stores need.

4. Delete the demo screens

rm -rf apps/mobile/app/demo

On Windows PowerShell: Remove-Item -Recurse -Force apps\mobile\app\demo.

Then remove the links to them in apps/mobile/app/index.tsx, and write your own home screen.

Delete last, not first

The demo screens are the clearest reference for how a feature is wired. Keep them until you have built your own version of the ones you need, then remove them all at once.

5. Turn off what you do not need

  • No login? Set EXPO_PUBLIC_AUTH_ENABLED=false in apps/mobile/.env, then delete apps/mobile/app/(auth). We tested this: the sign-in wall and every account control disappear, and the rest of the app keeps working.
  • No payments? Leave the payment keys blank. The adapter becomes a no-op.
  • Your own backend? Delete apps/api. See Connect Your Own Backend.

6. Make the analytics yours

Event names live as a typed union in packages/analytics/src/events.ts, 15 of them out of the box. Add yours as a new member and every track() call gets type checking. A renamed event becomes a compile error instead of a silently broken funnel six weeks later.

7. Check nothing broke

pnpm test
Claude CodeLet Claude do the sweep

Rebrand this project to Trailhead, bundle id com.mycompany.trailhead, primary colour #0F766E. Update app.json and global.css, then list every remaining file that still says Expo Native Starter.

Next: Ship to the Stores.

Stop reinventing the app shell. Start shipping.

React Native and Expo boilerplate built for Claude Code, Cursor and Copilot. Auth, payments, push and offline sync already wired, with a 37-row map telling your agent where each one lives.

Get it for $59 →