ahmtshn-create-app

CLI tool to quickly bootstrap Expo + Uniwind + HeroUI Native projects with a single command.

Features

• 🚀 Creates Expo app with with-router-uniwind template
• 🎨 Configures Tailwind CSS and Uniwind
• 📦 Installs and configures HeroUI Native with all peer dependencies
• ⚙️ Sets up Metro bundler with Uniwind config
• 🎯 Auto-configures providers (HeroUINativeProvider, GestureHandlerRootView)
• ✨ Includes production-ready Text component configuration

Quick Start

npx ahmtshn-create-app

The CLI will prompt you for a project name and automatically set up everything you need.

What It Does

Step 1: Create Expo App

Creates a new Expo project using the with-router-uniwind template.

Step 2: Setup Global CSS

Creates src/global.css with the following imports:

@import "tailwindcss";
@import "uniwind";
@import "heroui-native/styles";
@source './node_modules/heroui-native/lib';

Step 3: Configure Metro

Generates and configures metro.config.js with Uniwind support:

• Sets up CSS entry file path
• Configures TypeScript typings generation

Step 4: Install Dependencies

Installs HeroUI Native and all required peer dependencies:

• heroui-native
• react-native-screens@~4.16.0
• react-native-reanimated@~4.1.1
• react-native-gesture-handler@^2.28.0
• [email protected]
• react-native-safe-area-context@~5.6.0
• [email protected]
• tailwind-variants@^3.2.2
• tailwind-merge@^3.4.0
• @gorhom/bottom-sheet@^5

Step 5: Setup App Layout

Configures app/_layout.tsx with:

• GestureHandlerRootView wrapper
• HeroUINativeProvider with text configuration
• Optimized text rendering settings

After Installation

Once the CLI finishes, navigate to your project and start the development server:

cd your-project-name
bunx expo start

Important: Run the Metro server at least once to generate TypeScript typings for Uniwind.

Requirements

• Node.js >= 18.0.0
• Bun (for package management)

Project Structure

After running the CLI, your project will have:

your-project-name/
├── app/
│   └── _layout.tsx          # Provider configuration
├── src/
│   ├── global.css           # Global styles
│   └── uniwind-types.d.ts   # Auto-generated (after first run)
├── metro.config.js          # Metro bundler config
└── package.json

Technologies Used

• Expo - React Native framework
• Expo Router - File-based routing
• Uniwind - Unified styling for React Native
• HeroUI Native - Beautiful UI components
• Tailwind CSS - Utility-first CSS

License

MIT

Author

Ahmet Sahin