React Native Starter Package

Готовый к использованию React Native стартер с Expo, TypeScript, Navigation, Authentication и Tailwind CSS (NativeWind).

Версия: 1.0.0

Возможности

• ⚛️ React Native с Expo
• 📘 TypeScript для типобезопасности
• 🧭 React Navigation для навигации
• 🔐 Authentication система с Secure Store
• 🎨 Tailwind CSS через NativeWind
• 📡 React Query для управления состоянием сервера
• 📝 React Hook Form для работы с формами
• 🎭 Lottie анимации
• 🎯 Axios для HTTP запросов
• 🔔 Toast уведомления

Требования

• Node.js >= 18.0.0
• npm >= 9.0.0 или yarn >= 1.22.0
• Expo CLI (устанавливается автоматически)
• Для iOS: Xcode и CocoaPods
• Для Android: Android Studio и Android SDK

Установка

Через npm

npm install react-native-starter-package-yogio

Через yarn

yarn add react-native-starter-package-yogio

Использование

Способ 1: Использование скрипта инициализации (Рекомендуется)

После установки пакета, запустите скрипт инициализации:

npx react-native-starter-package-yogio

Этот скрипт автоматически скопирует все необходимые файлы в ваш проект.

Способ 2: Ручное копирование

Если вы предпочитаете копировать файлы вручную:

# Скопируйте структуру проекта
cp -r node_modules/react-native-starter-package-yogio/app ./app
cp node_modules/react-native-starter-package-yogio/App.tsx ./
cp node_modules/react-native-starter-package-yogio/app.json ./
cp node_modules/react-native-starter-package-yogio/babel.config.js ./
cp node_modules/react-native-starter-package-yogio/metro.config.js ./
cp node_modules/react-native-starter-package-yogio/tailwind.config.js ./
cp node_modules/react-native-starter-package-yogio/tsconfig.json ./
cp node_modules/react-native-starter-package-yogio/tw.d.ts ./

Структура проекта

app/
├── assets/          # Изображения, шрифты, SVG, Lottie файлы
│   ├── fonts/      # Шрифты Gilroy
│   ├── lotties/    # Lottie анимации
│   └── svg/        # SVG иконки
├── components/      # React компоненты
│   ├── screens/    # Экраны приложения (Auth, Home, Profile, Settings, Statistics)
│   └── ui/         # UI компоненты (Form elements, Layout, Splash, Toast)
├── config/         # Конфигурационные файлы (API, Fonts)
├── hooks/          # Custom React hooks
├── navigation/     # Навигация (Navigation, PrivateNavigation, Routes)
├── providers/      # Context providers (Auth)
├── services/       # API и бизнес-логика
│   ├── api/        # API конфигурация и interceptors
│   └── auth/       # Сервисы аутентификации
└── shared/         # Общие утилиты и типы
    └── types/      # TypeScript интерфейсы

Настройка

1. Обновите app.json

Измените название приложения, bundle identifier и другие настройки в app.json:

{
  "expo": {
    "name": "YourAppName",
    "slug": "your-app-slug",
    "ios": {
      "bundleIdentifier": "com.yourcompany.yourapp"
    }
  }
}

2. Настройте API

Обновите конфигурацию API в app/config/api.config.ts:

export const API_CONFIG = {
  baseURL: 'https://your-api-url.com',
  // ...
}

3. Настройте переменные окружения

Создайте файл .env в корне проекта:

API_URL=https://your-api-url.com
API_KEY=your-api-key

Запуск проекта

# Установите зависимости
npm install
# или
yarn install

# Запустите проект
npm start
# или
yarn start

# Для iOS
npm run ios
# или
yarn ios

# Для Android
npm run android
# или
yarn android

Зависимости

Основные зависимости включены в пакет. После установки убедитесь, что все зависимости установлены:

npm install
# или
yarn install

Основные зависимости

• expo ^54.0.0 - Expo SDK
• react-native 0.81.5 - React Native framework
• react 19.1.0 - React library
• @react-navigation/native ^7.1.27 - Навигация
• @tanstack/react-query ^5.49.2 - Управление серверным состоянием
• react-hook-form ^7.52.1 - Работа с формами
• nativewind ^2.0.11 - Tailwind CSS для React Native
• axios ^1.7.2 - HTTP клиент
• lottie-react-native ~7.3.1 - Lottie анимации
• expo-secure-store ~15.0.8 - Безопасное хранилище
• react-native-toast-message ^2.2.0 - Toast уведомления

Лицензия

MIT

Поддержка

Если у вас возникли вопросы или проблемы, создайте issue в репозитории проекта.