Client Builds
Ship a branded Storefront App for a business — a private fork with one brand folder that holds everything the business owns, upgraded to each new release with a plain merge.
Client Builds
A branded app for a business is a fork of storefront-app with one extra folder, brand/, that holds everything that business owns. The fork never edits the app's own files, so taking a new release is a merge with no conflicts.
The brand folder
brand/
storefront.brand.ts colors, fonts, components, tabs, home screen
storefront.extensions.ts replaced screens, added screens and tabs
screens/ the business's own screens
translations/<locale>.json copy over the app's strings
fonts/ font files, named by PostScript name
app-icon.png 1024×1024 app icon
splash-screen.png the launch screen logo
assets/ images the business's screens useEvery file is optional. Without brand/, the app builds the stock storefront from the empty templates at the repository root.
| Need | Where | Docs |
|---|---|---|
| Colors, fonts, buttons, cards | brand/storefront.brand.ts | Branding |
| Home screen and tabs | navigation, screens in the brand file | Home Screens & Tabs |
| Replace or add screens and tabs | brand/storefront.extensions.ts | Extending |
| Copy and languages | brand/translations/ | Branding → Copy |
| Icon and launch screen | brand/app-icon.png, brand/splash-screen.png | Branding → App icon |
| Keys, host, payment gateway, sign-in | .env, written by the release pipeline | Configuration |
yarn install links the brand files into the app (it writes small modules to src/generated/, which is git-ignored). After adding or removing a file in brand/, run yarn brand:link or restart Metro.
Setting up a fork
git clone https://github.com/fleetbase/storefront-app.git my-store-app
cd my-store-app
git remote rename origin upstream
git remote add origin git@github.com:my-company/my-store-app.git
mkdir brandThen add the brand file, artwork and translations, and push to your private repository.
Upgrading to a new release
git fetch upstream
git merge upstream/<release branch or tag>
yarn install
yarn typecheck:strictBecause the fork only adds brand/, the merge has no conflicts. yarn typecheck:strict checks the brand file and the build's screens against the release; the release notes list any breaking changes to branding options, screen ids or the components and hooks client screens use. After a release that changes native dependencies, run yarn pod:install before building for iOS.
The app's identity
The app's name, bundle id, icons, signing and Firebase files live in the native projects, which belong to the app's repository. Two ways to handle them:
- In the release pipeline (recommended for many builds): write
.env, set the bundle id and team, placegoogle-services.jsonand generate icons during the build, so the fork's commits never touch native files. - Committed in the fork: simpler for one build, but a release that changes the same native files will conflict on merge.
See Build & Release for each value.
What belongs where
The storefront-app repository is the build every business uses, so it only contains features that work for any store or Network, switched off by default. A business's own names, tags, keys, copy and screens go in its brand/ folder and .env, never in the app's code. When a business needs something more general, such as a new home screen layout, it can be proposed to the app as an option other builds can turn on.