npm package: @hieuvh301195/rn-expo-template
Description: A comprehensive React Native Expo template with TypeScript, Redux, i18n, theming, and testing
Author: hieuvh
Latest version: 1.0.0

# @hieuvh301195/rn-expo-template

A comprehensive React Native Expo template with TypeScript, Redux, i18n, theming, and 100% test coverage.

## Quick Start

Create a new project using this template:

```bash
npx create-expo-app@latest my-awesome-app --template @hieuvh301195/rn-expo-template
```

Then:

```bash
cd my-awesome-app
yarn install
yarn start
```

## After Creating Your Project

1. **Update app.json** with your app details:
   - `name`: Your app display name
   - `slug`: Your app slug (lowercase, no spaces)
   - `ios.bundleIdentifier`: Your iOS bundle ID (e.g., `com.yourcompany.myapp`)
   - `android.package`: Your Android package name (e.g., `com.yourcompany.myapp`)
   - `scheme`: Your app deep link scheme

2. **Set up environment variables**:

   ```bash
   cp .env.example .env
   # Edit .env with your values
   ```

3. **Install Husky hooks**:

   ```bash
   yarn prepare
   ```

4. **Run the app**:
   ```bash
   yarn start
   ```

## Features

- **Expo Router**: File-based routing with drawer navigation
- **Authentication**: Login & Register screens with form validation
- **Todo Management**: Todo list with filter tabs (All, New, Done)
- **Drawer Navigation**: User profile, settings access, app version
- **Settings**: Language switching (EN/VI), Theme switching (Light/Dark)
- **State Management**: Redux Toolkit with typed hooks
- **API Layer**: Axios with interceptors for logging and error handling
- **Internationalization**: i18next with English and Vietnamese
- **Theming**: Light and Dark theme support with ThemeProvider
- **Performance**: Memoization with useMemo, useCallback, and memo
- **Testing**: Jest with 100% coverage requirement (104 tests)
- **Code Quality**: ESLint, Prettier, Husky pre-commit hooks

## Project Structure

```
your-app/
├── __tests__/                 # Test files
│   ├── components/            # Component tests
│   ├── hooks/                 # Hook tests
│   ├── services/              # Service tests
│   ├── store/                 # Redux store tests
│   └── utils/                 # Utility tests
├── app/                       # Expo Router screens
│   ├── _layout.tsx            # Root layout (providers)
│   ├── index.tsx              # Entry redirect
│   ├── (auth)/                # Auth route group
│   │   ├── _layout.tsx        # Auth stack layout
│   │   ├── login/             # Login screen
│   │   └── register/          # Register screen
│   └── (main)/                # Main route group (drawer)
│       ├── _layout.tsx        # Drawer layout
│       ├── home/              # Home screen
│       └── settings/          # Settings screen
├── src/
│   ├── api/                   # API layer (Axios client, endpoints)
│   ├── components/            # Reusable components
│   │   ├── atoms/             # Basic components (Button, Input)
│   │   ├── molecules/         # Composed components (TodoItem)
│   │   └── organisms/         # Complex components (TodoList)
│   ├── hooks/                 # Custom hooks
│   ├── i18n/                  # Internationalization
│   ├── store/                 # Redux store
│   ├── theme/                 # Theme configuration
│   └── types/                 # TypeScript types
├── docs/                      # Documentation
└── package.json
```

## Available Scripts

| Command              | Description                   |
| -------------------- | ----------------------------- |
| `yarn start`         | Start Expo development server |
| `yarn android`       | Run on Android                |
| `yarn ios`           | Run on iOS                    |
| `yarn web`           | Run on Web                    |
| `yarn test`          | Run tests                     |
| `yarn test:coverage` | Run tests with coverage       |
| `yarn lint`          | Run ESLint                    |
| `yarn lint:fix`      | Fix ESLint issues             |
| `yarn format`        | Format code with Prettier     |
| `yarn typecheck`     | TypeScript type checking      |

## Documentation

- [Architecture Guide](./docs/ARCHITECTURE.md) - System design and layers
- [Coding Conventions](./docs/CONVENTIONS.md) - Code style and patterns
- [Contributing Guide](./docs/CONTRIBUTING.md) - How to add features
- [Quick Reference](./docs/QUICK_REFERENCE.md) - One-page cheat sheet
- [AI Context](./docs/AI_CONTEXT.md) - Essential context for AI maintainers

## Tech Stack

- **Framework**: React Native with Expo SDK 53
- **Routing**: Expo Router (file-based)
- **State Management**: Redux Toolkit
- **Styling**: React Native StyleSheet with ThemeProvider
- **i18n**: i18next + react-i18next
- **HTTP Client**: Axios
- **Testing**: Jest + React Native Testing Library
- **Linting**: ESLint + Prettier
- **Git Hooks**: Husky + lint-staged

## Publishing Template (For Maintainers)

To publish or update the template:

```bash
# Login to npm
npm login

# Publish
npm publish --access public
```

## License

MIT