@highbeek/create-rnstarterkit 1.0.2-beta.12 → 1.0.2-beta.13

package/README.md

@@ -1,8 +1,8 @@
 # RNStarterKit
 
-**A CLI tool that scaffolds production-ready React Native apps with clean architecture and sensible defaults.**
+**A CLI that scaffolds production-ready React Native apps with clean architecture and sensible defaults.**
 
-Not a replacement for Expo or React Native CLI — it sits on top of them and structures your project the right way from day one.
+Not a replacement for Expo or React Native CLI — it sits on top of them and structures your project correctly from day one.
 
 ```bash
 npx @highbeek/create-rnstarterkit myApp
@@ -12,221 +12,199 @@ npx @highbeek/create-rnstarterkit myApp
 
 ## Why This Exists
 
-Every serious React Native project eventually ends up with the same architecture decisions:
+Every serious React Native project ends up making the same decisions:
 
 - Where do API calls live?
 - How is auth state managed and persisted?
 - What's the folder structure when the app scales?
 - How are environment variables typed?
-- Where does validation logic go?
 
-This tool answers those questions upfront. You get a clean, feature-based structure with your chosen stack — ready to build on, not fight against.
+This tool answers those questions upfront. You get a complete, typed, linted project with your chosen stack — ready to build on, not fight against.
 
 ---
 
-## What It Generates
+## Quick Start
 
-The CLI walks you through a set of prompts and generates a complete project:
+```bash
+# Interactive setup
+npx @highbeek/create-rnstarterkit myApp
 
-```
-src/
-  app/                   # App entry, shell, providers
-  features/
-    auth/                # Login, Register screens + auth flow (optional)
-  screens/               # Additional screens
-  navigation/            # React Navigation or Expo Router setup
-  api/                   # Axios/Fetch client + interceptors (optional)
-  services/              # React Query client setup (optional)
-  store/                 # Redux / Zustand store (optional)
-  config/                # Typed environment config
-  hooks/                 # Shared custom hooks
-  utils/                 # Shared utilities
-  components/            # Shared UI components
-  constants/             # App-wide constants
-  types/                 # TypeScript types and interfaces
-  assets/
-    images/
-    fonts/
+# Skip prompts with a preset
+npx @highbeek/create-rnstarterkit myApp --preset fintech
+npx @highbeek/create-rnstarterkit myApp --preset social
+npx @highbeek/create-rnstarterkit myApp --preset indie
+npx @highbeek/create-rnstarterkit myApp --preset minimal
 ```
 
 ---
 
-## Installation
-
-```bash
-npx @highbeek/create-rnstarterkit myApp
-```
+## Presets
 
-Or install globally:
+Presets bundle the most common stack combinations so you can skip all prompts:
 
-```bash
-npm install -g @highbeek/create-rnstarterkit
-create-rnstarterkit myApp
-```
+| Preset | Platform | State | Auth | Data | Storage | Extras |
+|---|---|---|---|---|---|---|
+| `minimal` | Expo | None | No | None | None | Bare structure |
+| `indie` | Either | Context API | Yes | React Query | AsyncStorage | Husky |
+| `social` | Expo | Zustand | Yes | SWR | AsyncStorage | Sentry, i18n, CI |
+| `fintech` | RN CLI | Redux Toolkit | Yes | React Query | MMKV | Sentry, i18n, Maestro, CI |
 
 ---
 
 ## Interactive Setup
 
-The CLI prompts you to configure your stack:
+When run without a preset, the CLI walks you through your stack:
 
 ```
-? Project name: myApp
-? Platform: Expo / React Native CLI
-? TypeScript: Yes / No
-? Absolute imports (@/*): Yes / No
-? State management: None / Context API / Redux Toolkit / Zustand
-? Data fetching: None / React Query / SWR
-? Form validation: None / Formik / React Hook Form + Yup
-? Storage: AsyncStorage / MMKV / None
-? Include auth scaffold: Yes / No
-? Include API client: Yes / No (Fetch / Axios)
-? Include CI setup: Yes / No
+? Project name:
+? Platform:                Expo / React Native CLI
+? TypeScript:              Yes / No
+? Absolute imports (@/*):  Yes / No
+? State management:        None / Context API / Redux Toolkit / Zustand
+? Data fetching:           None / React Query / SWR
+? Validation:              Formik / React Hook Form / Yup
+? Storage:                 AsyncStorage / MMKV / None
+? Auth scaffold:           Yes / No
+? API client:              Yes / No  →  Fetch / Axios
+? Sentry:                  Yes / No
+? i18n (i18next):          Yes / No
+? Maestro E2E flows:       Yes / No
+? CI (GitHub Actions):     Yes / No
+? Husky pre-commit hooks:  Yes / No
 ```
 
 ---
 
-## What's Included
-
-### Platform Templates
-
-| Feature | Expo | React Native CLI |
-|---|---|---|
-| File-based routing | expo-router | — |
-| React Navigation | — | Native Stack v7 |
-| TypeScript | Default | Default |
-| Babel absolute imports | Optional | Optional |
-| ESLint + Prettier | Configured | Configured |
-| Jest | Configured | Configured |
-| Native iOS/Android | Managed | Full native project |
+## Generator Commands
 
-### Auth Scaffold (Optional)
+After scaffolding, use the `generate` subcommand to add code that matches your project's setup:
 
-Three implementations — pick one:
-
-**Context API** — Recommended for most apps. Lightweight, no extra dependencies.
-
-**Redux Toolkit** — If you're using Redux for global state. Comes with auth slice + persistence.
-
-**Zustand** — Minimal API, no boilerplate. Zustand store with AsyncStorage hydration.
-
-All three include:
-- Login + Register screens
-- Protected route stack
-- Token persistence via AsyncStorage
-- ScreenLayout wrapper component
+```bash
+# Run from inside your generated project
+npx @highbeek/create-rnstarterkit generate screen Dashboard
+npx @highbeek/create-rnstarterkit generate component Avatar
+npx @highbeek/create-rnstarterkit generate hook useDebounce
+npx @highbeek/create-rnstarterkit generate slice cart
+```
 
-### API Client (Optional)
+Generators are context-aware — they read your project's config from `package.json` and produce files with the correct imports for your state manager, platform, and auth setup.
 
-**Fetch** — Zero dependencies, typed wrapper with interceptors.
+| Command | Output |
+|---|---|
+| `generate screen Name` | `src/screens/NameScreen.tsx` with correct state hook |
+| `generate component Name` | `src/components/Name.tsx` with typed props + StyleSheet |
+| `generate hook useName` | `src/hooks/useName.ts` with loading/error boilerplate |
+| `generate slice name` | `src/store/nameSlice.ts` + auto-patches `store.ts` |
 
-**Axios** — Full Axios instance with request/response interceptors, error normalisation, and typed response helpers.
+> `generate slice` only works in Redux Toolkit projects. It automatically adds the reducer to your store.
 
-### Environment Config
+---
 
-Typed environment variables with platform-aware setup:
+## What Gets Generated
 
-```typescript
-// config/env.ts
-export const ENV = {
-  API_BASE_URL: process.env.API_BASE_URL ?? "https://api.example.com",
-};
+```
+<project>/
+├── src/
+│   ├── api/              # API client + endpoints
+│   ├── components/       # Shared UI components + ErrorBoundary
+│   ├── config/           # Typed env config
+│   ├── context/          # Context API providers (if selected)
+│   ├── hooks/            # Shared custom hooks
+│   ├── i18n/             # i18next config + locales (if selected)
+│   ├── navigation/       # Navigation setup (RN CLI)
+│   ├── providers/        # App-level providers
+│   ├── screens/          # App screens
+│   ├── services/         # Query clients, external services
+│   ├── store/            # Redux / Zustand store (if selected)
+│   ├── theme/            # Color tokens, spacing, typography
+│   ├── types/            # Shared TypeScript types
+│   └── utils/            # Shared utilities + Sentry (if selected)
+├── .env.example          # Environment variable template
+├── .husky/               # Pre-commit hooks (if selected)
+├── .maestro/             # E2E flows (if selected)
+├── .vscode/              # Editor config + extension recommendations
+└── .github/workflows/    # CI pipeline (if selected)
 ```
 
-Expo uses `EXPO_PUBLIC_*` variables. CLI uses `react-native-dotenv`.
-
-### Data Fetching (Optional)
+---
 
-**React Query** — QueryClient pre-configured, ready to wrap your app.
+## Optional Modules
 
-**SWR** — Installed and ready to use.
+### Auth Scaffold
 
-### State Management (Optional)
+Three implementations — all include Login/Register screens, protected routes, token persistence, and a ScreenLayout wrapper:
 
-| Option | Package | Use When |
+| Option | State | Best For |
 |---|---|---|
-| None | — | App state is local |
-| Context API | Built-in React | Simple global state |
-| Redux Toolkit | @reduxjs/toolkit | Complex state, devtools |
-| Zustand | zustand | Minimal, fast, no boilerplate |
+| Context API | Built-in React | Most apps |
+| Redux Toolkit | `@reduxjs/toolkit` | Complex global state |
+| Zustand | `zustand` | Minimal, no boilerplate |
 
-### Validation (Optional)
+### API Client
 
-| Option | Packages |
+| Option | Description |
 |---|---|
-| Formik | formik |
-| React Hook Form + Yup | react-hook-form + yup |
+| Fetch | Zero deps — typed wrapper with request/response interceptors |
+| Axios | Full Axios instance with error normalisation + typed helpers |
 
-### Config / Tooling
+### Data Fetching
 
-- **ESLint** — Extends `@react-native` config
-- **Prettier** — Single quotes, trailing commas, arrow parens
-- **Babel** — Configured with optional dotenv + module-resolver plugins
-- **Jest** — `react-native` preset with example test
+| Option | Setup |
+|---|---|
+| React Query | QueryClient pre-configured with retry + stale time defaults |
+| SWR | SWRConfig provider + typed `useSWRFetch` hook |
 
----
+### Storage
 
-## Architecture Philosophy
+| Option | Description |
+|---|---|
+| AsyncStorage | Default — async token persistence |
+| MMKV | Synchronous, 10x faster, drop-in replacement |
 
-**Feature-based, not layer-based.**
+### Sentry
 
-Rather than grouping files by type (all screens together, all hooks together), related code lives together by feature. This scales better as the app grows.
+Adds `@sentry/react-native`, initialises in the app entry point, and exports `captureException` + `addBreadcrumb` helpers. Replace `__YOUR_DSN__` in `src/utils/sentry.ts` with your project DSN.
 
-```
-features/
-  auth/
-    screens/
-      LoginScreen.tsx
-      RegisterScreen.tsx
-    hooks/
-      useLogin.ts
-    api/
-      authApi.ts
-```
+### i18n
 
-Shared code (components, utils, hooks used across features) lives in `shared/` or `components/` at the top level.
+Adds `i18next` + `react-i18next` with:
+- Language auto-detection via `react-native-localize`
+- English + Spanish locale files as a starting point
+- Typed `useAppTranslation` hook
 
-**Thin screens, fat services.**
+### Maestro E2E
 
-Screens handle UI and user interaction. Business logic, API calls, and state live in services/hooks. Screens don't call APIs directly.
+Generates `.maestro/flows/` with welcome, login, and logout flows. Automatically adds a Maestro job to the CI workflow when both are selected.
 
-**Typed from the start.**
+### CI
 
-TypeScript is on by default. Environment variables are typed. API responses are typed. No `any` defaults.
+GitHub Actions workflow with lint and test jobs on push/PR to `main` and `develop`.
 
 ---
 
-## Roadmap
-
-**In Progress**
+## Tooling (Always Included)
 
-- [ ] MMKV storage integration (directory scaffolded, wiring in progress)
-- [ ] Theming system (color tokens, typography scale, theme provider)
-- [ ] Pre-commit hooks with Husky + lint-staged
-
-**Planned**
-
-- [ ] `@testing-library/react-native` setup
-- [ ] GitHub Actions CI workflow template
-- [ ] Dark mode support
-- [ ] Error boundary scaffold
-- [ ] i18n setup (react-i18next)
-
-**Not Planned (Intentionally)**
-
-- Custom UI component library — use your own or NativeBase, Tamagui, etc.
-- Analytics or tracking — too opinionated, too many options
-- Monorepo setup — out of scope for v1
+| Tool | Config |
+|---|---|
+| TypeScript | `strict: true`, platform-native tsconfig |
+| ESLint | `@react-native` ruleset, `--max-warnings 0` |
+| Prettier | `format` script wired to `package.json` |
+| Jest | RTL setup, `transformIgnorePatterns` for RN modules |
+| VSCode | `extensions.json` + `settings.json` (format on save) |
+| `.env.example` | Environment variable template + `.gitignore` entry |
+| Theme | `colors.ts`, `spacing.ts`, `typography.ts` tokens |
+| ErrorBoundary | Class component with reset, ready to wrap your app |
+| Navigation types | `AuthStackParamList`, `MainTabParamList` (RN CLI + auth) |
 
 ---
 
-## Status
+## Architecture
 
-Current version: `1.0.1-beta.3`
+**Typed from the start.** TypeScript strict mode on by default. API responses, environment variables, and navigation params are all typed.
 
-This is a beta release. The core scaffolding (folder structure, auth, API client, state management) is working. Some optional modules (MMKV, theming) are scaffolded but not yet wired.
+**Thin screens, fat hooks.** Screens handle UI. Business logic, API calls, and state live in hooks and services. Screens don't call APIs directly.
 
-Feedback and contributions welcome.
+**Non-destructive generation.** `writeIfMissing` is used throughout — the generator never overwrites files you've already customised.
 
 ---
 
@@ -237,15 +215,24 @@ git clone https://github.com/highbeek/rnstarterkit
 cd rnstarterkit
 npm install
 npm run build
+
+# Test locally
+node dist/bin/create-rnstarterkit.js myTestApp
+node dist/bin/create-rnstarterkit.js myTestApp --preset fintech
+
+# Test generators (from inside a generated project)
+node /path/to/rnstarterkit/dist/bin/create-rnstarterkit.js generate screen Dashboard
 ```
 
-Templates live in `src/templates/`. The generator logic is in `src/generators/appGenerator.ts`. Optional modules are in `src/templates/optional/`.
+Templates live in `src/templates/`. Generator logic is in `src/generators/appGenerator.ts`. The `generate` subcommand is in `src/generators/codeGenerator.ts`.
 
-To test the CLI locally:
+---
 
-```bash
-node dist/bin/create-rnstarterkit.js myTestApp
-```
+## Status
+
+Current version: `1.0.2-beta.13`
+
+Beta release — core scaffolding, presets, and generators are working. Feedback and contributions welcome.
 
 ---
 

package/dist/bin/create-rnstarterkit.js

@@ -4,15 +4,90 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const commander_1 = require("commander");
 const inquirer_1 = __importDefault(require("inquirer"));
 const appGenerator_1 = require("../src/generators/appGenerator");
-async function main() {
-    console.log("🚀 Welcome to RNStarterKit!");
+const codeGenerator_1 = require("../src/generators/codeGenerator");
+// ---------------------------------------------------------------------------
+// Presets — opinionated bundles that skip the 12-question prompt
+// ---------------------------------------------------------------------------
+const PRESETS = {
+    minimal: {
+        typescript: true,
+        absoluteImports: false,
+        state: "None",
+        auth: false,
+        dataFetching: "None",
+        validation: [],
+        storage: "None",
+        apiClient: false,
+        ci: false,
+        husky: false,
+        sentry: false,
+        i18n: false,
+        maestro: false,
+    },
+    fintech: {
+        platform: "React Native CLI",
+        typescript: true,
+        absoluteImports: true,
+        state: "Redux Toolkit",
+        auth: true,
+        dataFetching: "React Query",
+        validation: [],
+        storage: "MMKV",
+        apiClient: true,
+        apiClientType: "Fetch",
+        ci: true,
+        husky: true,
+        sentry: true,
+        i18n: true,
+        maestro: true,
+    },
+    social: {
+        platform: "Expo",
+        typescript: true,
+        absoluteImports: true,
+        state: "Zustand",
+        auth: true,
+        dataFetching: "SWR",
+        validation: [],
+        storage: "AsyncStorage",
+        apiClient: true,
+        apiClientType: "Fetch",
+        ci: true,
+        husky: true,
+        sentry: true,
+        i18n: true,
+        maestro: false,
+    },
+    indie: {
+        typescript: true,
+        absoluteImports: true,
+        state: "Context API",
+        auth: true,
+        dataFetching: "React Query",
+        validation: [],
+        storage: "AsyncStorage",
+        apiClient: true,
+        apiClientType: "Fetch",
+        ci: false,
+        husky: true,
+        sentry: false,
+        i18n: false,
+        maestro: false,
+    },
+};
+// ---------------------------------------------------------------------------
+// Interactive prompt
+// ---------------------------------------------------------------------------
+async function runInteractivePrompt(prefilledName, presetDefaults) {
     const answers = await inquirer_1.default.prompt([
         {
             type: "input",
             name: "projectName",
             message: "Project name:",
+            when: () => !prefilledName,
             validate: (input) => /^[A-Za-z0-9]+$/.test(input)
                 ? true
                 : "Project name must be alphanumeric",
@@ -22,18 +97,21 @@ async function main() {
             name: "platform",
             message: "Choose platform",
             choices: ["Expo", "React Native CLI"],
+            when: () => !presetDefaults?.platform,
         },
         {
             type: "confirm",
             name: "typescript",
             message: "Use TypeScript?",
             default: true,
+            when: () => presetDefaults?.typescript === undefined,
         },
         {
             type: "confirm",
             name: "absoluteImports",
             message: "Use absolute import alias (@/*)?",
             default: true,
+            when: () => presetDefaults?.absoluteImports === undefined,
         },
         {
             type: "rawlist",
@@ -41,6 +119,7 @@ async function main() {
             message: "State management?",
             choices: ["None", "Context API", "Redux Toolkit", "Zustand"],
             default: "Context API",
+            when: () => !presetDefaults?.state,
         },
         {
             type: "rawlist",
@@ -48,6 +127,7 @@ async function main() {
             message: "Data fetching library?",
             choices: ["None", "React Query", "SWR"],
             default: "None",
+            when: () => !presetDefaults?.dataFetching,
         },
         {
             type: "checkbox",
@@ -55,6 +135,7 @@ async function main() {
             message: "Validation libraries?",
             choices: ["Formik", "React Hook Form", "Yup"],
             default: [],
+            when: () => !presetDefaults?.validation?.length,
             validate: (selected) => {
                 if (selected.includes("Formik") && !selected.includes("Yup")) {
                     return "Formik requires Yup in this starter. Select Yup as well.";
@@ -68,18 +149,21 @@ async function main() {
             message: "Storage method?",
             choices: ["AsyncStorage", "MMKV", "None"],
             default: "AsyncStorage",
+            when: () => !presetDefaults?.storage,
         },
         {
             type: "confirm",
             name: "auth",
             message: "Include auth scaffold?",
             default: false,
+            when: () => presetDefaults?.auth === undefined,
         },
         {
             type: "confirm",
             name: "apiClient",
             message: "Include API client scaffold?",
             default: true,
+            when: () => presetDefaults?.apiClient === undefined,
         },
         {
             type: "rawlist",
@@ -87,25 +171,119 @@ async function main() {
             message: "API client transport?",
             choices: ["Fetch", "Axios"],
             default: "Fetch",
-            when: (answers) => answers.apiClient,
+            when: (a) => presetDefaults?.apiClientType === undefined && a.apiClient,
+        },
+        {
+            type: "confirm",
+            name: "sentry",
+            message: "Include Sentry crash reporting?",
+            default: false,
+            when: () => presetDefaults?.sentry === undefined,
+        },
+        {
+            type: "confirm",
+            name: "i18n",
+            message: "Include i18n (i18next + react-i18next)?",
+            default: false,
+            when: () => presetDefaults?.i18n === undefined,
+        },
+        {
+            type: "confirm",
+            name: "maestro",
+            message: "Include Maestro E2E test flows?",
+            default: false,
+            when: () => presetDefaults?.maestro === undefined,
         },
         {
             type: "confirm",
             name: "ci",
-            message: "Include CI setup?",
+            message: "Include CI setup (GitHub Actions)?",
             default: false,
+            when: () => presetDefaults?.ci === undefined,
         },
         {
             type: "confirm",
             name: "husky",
             message: "Set up Husky pre-commit hooks (lint-staged)?",
             default: true,
+            when: () => presetDefaults?.husky === undefined,
         },
     ]);
-    await (0, appGenerator_1.generateApp)(answers);
+    return {
+        projectName: prefilledName ?? answers.projectName,
+        platform: answers.platform ?? presetDefaults?.platform ?? "Expo",
+        typescript: answers.typescript ?? presetDefaults?.typescript ?? true,
+        absoluteImports: answers.absoluteImports ?? presetDefaults?.absoluteImports ?? true,
+        state: answers.state ?? presetDefaults?.state ?? "None",
+        auth: answers.auth ?? presetDefaults?.auth ?? false,
+        dataFetching: answers.dataFetching ?? presetDefaults?.dataFetching ?? "None",
+        validation: answers.validation ?? presetDefaults?.validation ?? [],
+        storage: answers.storage ?? presetDefaults?.storage ?? "AsyncStorage",
+        apiClient: answers.apiClient ?? presetDefaults?.apiClient ?? false,
+        apiClientType: answers.apiClientType ?? presetDefaults?.apiClientType,
+        sentry: answers.sentry ?? presetDefaults?.sentry ?? false,
+        i18n: answers.i18n ?? presetDefaults?.i18n ?? false,
+        maestro: answers.maestro ?? presetDefaults?.maestro ?? false,
+        ci: answers.ci ?? presetDefaults?.ci ?? false,
+        husky: answers.husky ?? presetDefaults?.husky ?? true,
+    };
 }
-main().catch((error) => {
-    console.error("❌ Failed to create project.");
+// ---------------------------------------------------------------------------
+// CLI wiring
+// ---------------------------------------------------------------------------
+const program = new commander_1.Command();
+program
+    .name("create-rnstarterkit")
+    .description("Scaffold a production-ready React Native app")
+    .version("1.0.2-beta.12")
+    .argument("[projectName]", "Name of the project (alphanumeric)")
+    .option("--preset <name>", "Skip prompts with a preset: minimal | fintech | social | indie")
+    .action(async (projectName, cmdOptions) => {
+    console.log("🚀 Welcome to RNStarterKit!");
+    const presetKey = cmdOptions.preset;
+    if (presetKey && !(presetKey in PRESETS)) {
+        console.error(`❌ Unknown preset "${presetKey}". Available: ${Object.keys(PRESETS).join(", ")}`);
+        process.exit(1);
+    }
+    const presetDefaults = presetKey ? PRESETS[presetKey] : undefined;
+    // Preset + name supplied → fully non-interactive
+    if (presetDefaults && projectName) {
+        const options = {
+            projectName,
+            platform: presetDefaults.platform ?? "Expo",
+            typescript: presetDefaults.typescript ?? true,
+            absoluteImports: presetDefaults.absoluteImports ?? true,
+            state: presetDefaults.state ?? "None",
+            auth: presetDefaults.auth ?? false,
+            dataFetching: presetDefaults.dataFetching ?? "None",
+            validation: presetDefaults.validation ?? [],
+            storage: presetDefaults.storage ?? "AsyncStorage",
+            apiClient: presetDefaults.apiClient ?? false,
+            apiClientType: presetDefaults.apiClientType,
+            sentry: presetDefaults.sentry ?? false,
+            i18n: presetDefaults.i18n ?? false,
+            maestro: presetDefaults.maestro ?? false,
+            ci: presetDefaults.ci ?? false,
+            husky: presetDefaults.husky ?? true,
+        };
+        console.log(`⚡ Using preset: ${presetKey}`);
+        await (0, appGenerator_1.generateApp)(options);
+    }
+    else {
+        const options = await runInteractivePrompt(projectName, presetDefaults);
+        await (0, appGenerator_1.generateApp)(options);
+    }
+});
+// generate subcommand
+program
+    .command("generate <type> <name>")
+    .description("Generate code inside an existing rnstarterkit project\n" +
+    "  Types: screen | component | hook | slice")
+    .action(async (type, name) => {
+    await (0, codeGenerator_1.generateCode)(type, name);
+});
+program.parseAsync(process.argv).catch((error) => {
+    console.error("❌ Failed.");
     console.error(error);
     process.exit(1);
 });