@hubspire/expo-app NPM

Expo Application Template

This package helps to setup an Expo application using HubSpire's template.

Prerequisites

Make sure you have:

set up a bitbucket repository for the project with write access.
set up a Sentry account for the project.
the development, staging and production base API URLs.

Usage

To create the Expo project using this template, run:

$ bunx create-expo-app <ProjectName> --template @hubspire/expo-app

Getting Started

NOTE: When running scripts, it's important to initiate them from the top-level directory of the project.

Project setup

Create a .env file in root and add these environment variables:

GIT_REMOTE_URL =
SENTRY_ORG =
SENTRY_PROJECT =
SENTRY_AUTH_TOKEN =
SENTRY_DSN =
DEV_API_URL =
STAGING_API_URL =
PROD_API_URL =
OPENAPI_KEY =
FIGMA_TOKEN =
FIGMA_FILE =

Now run:

$ bun run project-setup

Make sure that you are running this script before making any changes to the project by yourself. This will :
Create the default environment files with the required environment variables for you. It will also update the env field inside eas.json with the values you provide during setup.
Remove/Update some values in the app.config.ts, eas.json, eas-build-on-success.sh and package.json files which are exclusive for the template project.
Remove readme file used for the template project.
Add secret folders and files to gitignore.
Initialise new repository for the project.
Publish an initial commit to the remote url you provided.

Setup push notification

Add your google-services.json (3 files for 3 environments) files inside assets/secrets folder.
Add environment secrets GOOGLE_SERVICES_JSON with their corresponding values for eas build to have access to these variables.
Make sure you have set up server credentials for android.
Make sure you have enabled push notification and generated APNS key for your iOS build when prompted during eas build.
Listeners to display notification, deep linking configurations for push notification and a button to send a test notification has been set up in the template.
Refer this documentation for more.

EAS

Install eas cli.

$ bun install -g eas-cli

$ eas login

Configure eas build.

$ bun run build:configure

Configure eas update.

$ bun run update:configure

Add environment variables in the Expo account.

Build and run development build using eas

$ bun run build:dev:eas

Testing

Unit Testing: Jest

$ bun run test:unit

E2E Testing: Maestro

$ bun run test:e2e:dev

CI/CD

Bitbucket: bitbucket-pipelines.yml

NOTE: Make sure you have set up the EXPO_TOKEN environment variable in your repository and MAESTRO_API_KEY as an environment secret.

Commits to _release/development branch will trigger EAS build using development:e2e profile.

Commits to release/staging branch will trigger EAS build using preview profile.

Commits to release/production branch will trigger EAS build using production profile.

EAS: eas-build-on-success.sh

A successful EAS build with the development:e2e profile will trigger E2E testing using Maestro. The flows are expected to be located inside the .maestro folder at the top-level directory of the project.

Work in Progress

This project is actively being developed. Current work in progress includes:

Automated component generation from Figma designs
- Integration with Figma API
- Component template generation
- Style extraction and application
- Generate test cases
- Generate stories
- Prompt optimizations and corrections