https://github.com/atliq/react-native-app-starter

This boilerplate code for react native adds things like redux, basic login, light+dark theme facility, multi-language support and Fastlane to the app.
https://github.com/atliq/react-native-app-starter

mobile-app react-native react-native-app react-native-basic react-native-boiler-plate react-native-boilerplate react-native-template

Last synced: 5 months ago
JSON representation

This boilerplate code for react native adds things like redux, basic login, light+dark theme facility, multi-language support and Fastlane to the app.

• Host: GitHub
• URL: https://github.com/atliq/react-native-app-starter
• Owner: atliq
• License: mit
• Created: 2021-01-31T08:48:10.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2024-11-26T09:30:41.000Z (over 1 year ago)
• Last Synced: 2025-02-01T03:24:00.934Z (about 1 year ago)
• Topics: mobile-app, react-native, react-native-app, react-native-basic, react-native-boiler-plate, react-native-boilerplate, react-native-template
• Language: JavaScript
• Homepage:
• Size: 711 KB
• Stars: 20
• Watchers: 3
• Forks: 7
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# react-native-app-starter

This project is a [React Native](https://facebook.github.io/react-native/) boilerplate that can be used to kickstart a mobile application.

The boilerplate provides **an optimized architecture for building solid cross-platform mobile applications** through separation of concerns between the UI and business logic. It contains redux, saga, context, theme, localization, tabs and stack navigation.




[![npm version](https://img.shields.io/npm/v/react-native-app-starter.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-app-starter)

## Getting Started

Creates a new React Native project with TypeScript template:

```bash

# Using npx with default package manager (bun)

$ npx react-native-app-starter 

# Using bunx with default package manager (bun)

$ bunx react-native-app-starter 

# Specifying a different package manager

$ npx react-native-app-starter  --pm yarn

$ npx react-native-app-starter  --pm npm

$ cd 

$ npx react-native run-ios

$ npx react-native run-android

```

### Package Manager Options

The CLI supports three package managers:

- **bun** (default) - Automatically installed if not present

- **yarn** - Prompts for installation if not present

- **npm** - Should be available with Node.js installation




## Directory Structure

```

root

├── __tests__

├── android

├── ios

└── App

    └── ApiConfig

    └── AppContext

    └── Routes

    └── Screens

    |    CommonComponent

    |    Components

    |    SubComponents

    └── Services

    └── Slices

    |   ├──Default

    └── Stores

    └── Thunks

    └── Theme

    |    Images

    |    Colors

    └── Utils

├── fastlane

├── .env

...

```




## Preconfigured with

- Latest react native version

- Redux Toolkit

- Theme support (Dark / Light)

- Utility for validations and error messages

- Custom font and font size for maintain typography

- .env and fastlane setup

- Support different env for PRODUCTION and DEVELOPMENT

- User Authentication flow

- UI for Login, Tabs and Settings




## Predefined UI

  Expand for screenshots

  iOS

  

    


    


    


    


  

  Android

  

    


    


    


    


    

  


## Development

This CLI tool is built with TypeScript and provides a modular architecture for easy maintenance and testing.

### Project Structure

```

├── src/

│   ├── config/           # Configuration constants

│   ├── services/         # Business logic services

│   ├── utils/           # Utility functions

│   ├── types/           # TypeScript type definitions

│   └── index.ts         # Main exports

├── dist/                # Compiled JavaScript output

├── index.ts            # CLI entry point

└── tsconfig.json       # TypeScript configuration

```

### Available Commands

- `npm run build` - Compile TypeScript to JavaScript

- `npm run dev` - Build and run the CLI tool

- `npm run test:modules` - Run example tests

- `npm run clean` - Remove compiled output

### Building from Source

```bash

# Clone the repository

git clone 

cd react-native-app-starter

# Install dependencies

npm install

# Build the project

npm run build

# Test the CLI

node dist/index.js --help

```

### Running with npx/bunx

After publishing, the package can be used with:

```bash

# Using npx

npx react-native-app-starter my-app

# Using bunx

bunx react-native-app-starter my-app

```