{"id":31582891,"url":"https://github.com/alloc/nativ","last_synced_at":"2026-05-03T10:35:07.639Z","repository":{"id":310922928,"uuid":"1041749947","full_name":"alloc/nativ","owner":"alloc","description":"An opinionated stack for React Native apps","archived":false,"fork":false,"pushed_at":"2025-10-02T00:21:55.000Z","size":1143,"stargazers_count":1,"open_issues_count":2,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-10-02T02:36:39.992Z","etag":null,"topics":["drizzle-orm","expo","react","react-native","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alloc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-08-21T00:41:00.000Z","updated_at":"2025-10-02T00:21:58.000Z","dependencies_parsed_at":"2025-08-21T03:49:45.883Z","dependency_job_id":"10bea566-5f48-494a-a2c9-394686e740c2","html_url":"https://github.com/alloc/nativ","commit_stats":null,"previous_names":["alloc/nativ"],"tags_count":58,"template":false,"template_full_name":null,"purl":"pkg:github/alloc/nativ","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Fnativ","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Fnativ/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Fnativ/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Fnativ/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alloc","download_url":"https://codeload.github.com/alloc/nativ/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alloc%2Fnativ/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278532493,"owners_count":26002370,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-05T02:00:06.059Z","response_time":54,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["drizzle-orm","expo","react","react-native","typescript"],"created_at":"2025-10-05T23:19:50.766Z","updated_at":"2025-10-05T23:19:54.103Z","avatar_url":"https://github.com/alloc.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# nativ\n\nA complete frontend stack for React Native apps that eliminates setup overhead and provides production-ready components out of the box.\n\n## What's Included\n\nNativ prescribes a comprehensive React Native stack with the following technologies:\n\n### Core Framework\n\n- **[Expo](https://expo.dev/)** (`v54`) - Platform and tooling for universal React Native apps\n- **[React Native](https://reactnative.dev/)** - Build native mobile apps using React\n- **[TypeScript](https://www.typescriptlang.org/)** - Type-safe JavaScript development\n- **[valtio](https://valtio.pmnd.rs/)** - Proxy-state library for React with minimal boilerplate\n- **[@tanstack/react-query](https://tanstack.com/query)** - Powerful data synchronization for React with caching, background updates, and optimistic updates\n\n### Navigation \u0026 Routing\n\n- **[expo-router](https://docs.expo.dev/router/introduction/)** (`v6`) - File-based routing for Expo apps.  \n  Builds upon these packages:\n  - **[@react-navigation/native](https://reactnavigation.org/)** (`v7`) - Routing and navigation library\n  - **[react-native-screens](https://github.com/software-mansion/react-native-screens)** - Native navigation primitives\n- **[react-native-safe-area-context](https://github.com/th3rdwave/react-native-safe-area-context)** - Safe area insets handling\n\n### UI \u0026 Styling\n\n- **[@shopify/restyle](https://github.com/Shopify/restyle)** - Type-enforced system for building UI components with theme-based styling (using `@alloc/restyle` fork)\n- **[@shopify/flash-list](https://shopify.github.io/flash-list/)** (`v2`) - High-performance list component for React Native\n- **[expo-linear-gradient](https://docs.expo.dev/versions/latest/sdk/linear-gradient/)** - Linear gradient view component\n- **[expo-status-bar](https://docs.expo.dev/versions/latest/sdk/status-bar/)** - Status bar configuration\n- **[expo-splash-screen](https://docs.expo.dev/versions/latest/sdk/splash-screen/)** - Splash screen management\n- **[expo-system-ui](https://docs.expo.dev/versions/latest/sdk/system-ui/)** - A library that allows interacting with system UI elements\n- **[react-native-keyboard-controller](https://kirillzyusko.github.io/react-native-keyboard-controller/)** - Comprehensive keyboard handling with KeyboardAvoidingView, KeyboardAwareScrollView, and more\n- **[@react-native-masked-view/masked-view](https://docs.expo.dev/versions/latest/sdk/masked-view/)** - Masked view component for creating visual effects and overlays\n\n### Animation\n\n- **[moti](https://moti.fyi/)** - Universal animation library for React Native (using `@alloc/moti` fork).  \n  Builds upon these packages:\n  - **[react-native-reanimated](https://docs.swmansion.com/react-native-reanimated/)** (`v4`) - High-performance animations and gestures\n  - **[react-native-worklets](https://github.com/margelo/react-native-worklets)** - High-performance JavaScript worklets for React Native\n- **[react-native-gesture-handler](https://docs.swmansion.com/react-native-gesture-handler/)** - Declarative API exposing platform native touch and gesture system\n\n### Database \u0026 ORM\n\n- **[expo-sqlite](https://docs.expo.dev/versions/latest/sdk/sqlite/)** - Local SQLite database access\n- **[drizzle-orm](https://orm.drizzle.team/)** (`v1`) - Lightweight TypeScript ORM with zero dependencies\n- **[drizzle-plus](https://github.com/alloc/drizzle-plus)** - Utility extensions for Drizzle ORM including count(), nest(), caseWhen(), and JSON helpers\n\n### Utilities \u0026 Helpers\n\n- **[radashi](https://radashi.js.org/)** - Modern TypeScript utility toolkit (Lodash alternative)\n- **[react-native-get-random-values](https://github.com/LinusU/react-native-get-random-values)** - Polyfill for crypto.getRandomValues()\n- **[react-native-hapticlabs](https://www.npmjs.com/package/react-native-hapticlabs)** - Advanced haptic feedback library for playing custom haptic patterns\n- **[@react-native-async-storage/async-storage](https://docs.expo.dev/versions/latest/sdk/async-storage/)** - Asynchronous, unencrypted, persistent, key-value storage system\n- **[@react-native-community/netinfo](https://docs.expo.dev/versions/latest/sdk/netinfo/)** - Network connectivity information and monitoring\n\n### Device \u0026 Platform APIs\n\n- **[expo-constants](https://docs.expo.dev/versions/latest/sdk/constants/)** - System and app constants\n- **[expo-device](https://docs.expo.dev/versions/latest/sdk/device/)** - Device information and capabilities\n- **[expo-font](https://docs.expo.dev/versions/latest/sdk/font/)** - Font loading and management\n- **[expo-image](https://docs.expo.dev/versions/latest/sdk/image/)** - Cross-platform, performant image component with advanced features like caching and format support\n- **[expo-linking](https://docs.expo.dev/versions/latest/sdk/linking/)** - Deep linking and URL handling\n- **[expo-localization](https://docs.expo.dev/versions/latest/sdk/localization/)** - Locale and language information\n- **[expo-notifications](https://docs.expo.dev/versions/latest/sdk/notifications/)** - Local and push notifications\n\n### Build \u0026 Development Tools\n\n- **[react-compiler](https://react.dev/learn/react-compiler/introduction)** - Automatic memoization at compile time\n- **[babel-preset-expo](https://github.com/expo/expo/tree/main/packages/babel-preset-expo)** - Babel preset for Expo projects\n- **[expo-build-properties](https://docs.expo.dev/versions/latest/sdk/build-properties/)** - Configure native build properties\n- **[expo-dev-client](https://docs.expo.dev/develop/development-builds/introduction/)** - Development client for custom native code\n\n### Runtime Support\n\n- **[react](https://react.dev/)** (`v19`) - React library for building user interfaces\n- **[react-dom](https://react.dev/reference/react-dom)** - React DOM bindings (for web compatibility)\n- **[@types/react](https://www.npmjs.com/package/@types/react)** - TypeScript definitions for React\n\n## Getting Started\n\n1. **Clone the template and create your project:**\n\n   ```bash\n   git clone https://github.com/alloc/nativ-template my-project-name --depth 1\n   cd my-project-name\n   ```\n\n2. **Run the setup script:**\n\n   \u003e **Note:** Requires Node.js v23.6+ for TypeScript support\n\n   ```bash\n   node setup.mts\n   ```\n\n   This will:\n   - Recreate the git repository\n   - Install all dependencies\n   - Install nativ peer dependencies\n   - Clean up the setup script\n\n   \u003e **Note:** After dependencies are installed, you may need to run `pnpm approve-builds` to approve certain dev dependencies like esbuild and puppeteer.\n\n3. **Customize your app metadata:**\n\n   Edit the following files to configure your app:\n   - **`package.json`**: Update app name, description, and other metadata\n   - **`app.json`**: Configure bundle identifier, native permissions, and Expo plugins\n   - **App Icon**: Place your app icon in `./assets/images/` folder\n\n   For app icon and splash screen guidance, see the [Expo documentation](https://docs.expo.dev/develop/user-interface/splash-screen-and-app-icon/).\n\n4. **Start the development server:**\n\n   ```bash\n   pnpm start\n   ```\n\n5. **Run on a platform:**\n   ```bash\n   pnpm ios     # iOS\n   pnpm android # Android\n   pnpm web     # Web\n   ```\n\n\u003e [!IMPORTANT]\n\u003e See the [template readme](./template/README.md) to learn what else is available to you.\n\n## API Reference\n\n### UI Primitives\n\n```typescript\nimport {\n  createView,\n  createText,\n  createImage,\n  createPressable,\n  createScrollView,\n  createMotiView,\n  createMotiPressable,\n  createMotiText,\n  createMotiImage,\n  createMotiScrollView,\n} from 'nativ/ui'\nimport type { Theme } from '~/theme'\n\nconst View = createView\u003cTheme\u003e()\nconst Text = createText\u003cTheme\u003e()\nconst Image = createImage\u003cTheme\u003e()\nconst Pressable = createPressable\u003cTheme\u003e()\nconst ScrollView = createScrollView\u003cTheme\u003e()\nconst MotiView = createMotiView\u003cTheme\u003e()\nconst MotiPressable = createMotiPressable\u003cTheme\u003e()\nconst MotiText = createMotiText\u003cTheme\u003e()\nconst MotiImage = createMotiImage\u003cTheme\u003e()\nconst MotiScrollView = createMotiScrollView\u003cTheme\u003e()\n```\n\nFactory functions exported by `nativ/ui`:\n\n- `createView` -\u003e `View` (Base layout component with Restyle props)\n- `createText` -\u003e `Text` (Typography with theme variants)\n- `createImage` -\u003e `Image` (Image with styling)\n- `createPressable` -\u003e `Pressable` (Touchable with styling)\n- `createScrollView` -\u003e `ScrollView` (Scrollable container with styling)\n- `createMotiView` -\u003e `MotiView` (Animated View with Moti integration)\n- `createMotiPressable` -\u003e `MotiPressable` (Animated Pressable with Moti interactions)\n- `createMotiText` -\u003e `MotiText` (Animated Text with Moti integration)\n- `createMotiImage` -\u003e `MotiImage` (Animated Image with Moti integration)\n- `createMotiScrollView` -\u003e `MotiScrollView` (Animated ScrollView with Moti integration)\n\n### Additional UI Components\n\n```typescript\nimport type { Theme } from '~/theme'\nimport {\n  createLinearGradient,\n  createFlashList,\n  createKeyboardAvoidingView,\n  createKeyboardAwareScrollView,\n  createKeyboardBackgroundView,\n  createKeyboardControllerView,\n  createKeyboardStickyView,\n} from 'nativ/ui'\n\nconst LinearGradient = createLinearGradient\u003cTheme\u003e()\nconst FlashList = createFlashList\u003cTheme\u003e()\nconst KeyboardAvoidingView = createKeyboardAvoidingView\u003cTheme\u003e()\nconst KeyboardAwareScrollView = createKeyboardAwareScrollView\u003cTheme\u003e()\nconst KeyboardBackgroundView = createKeyboardBackgroundView\u003cTheme\u003e()\nconst KeyboardControllerView = createKeyboardControllerView\u003cTheme\u003e()\nconst KeyboardStickyView = createKeyboardStickyView\u003cTheme\u003e()\n```\n\nYou can find more details about each component in the links below:\n\n- [expo-linear-gradient](https://docs.expo.dev/versions/latest/sdk/linear-gradient/)\n  - `LinearGradient` - Linear gradient view with `from`/`to` props (instead of `start`/`end`) for compatibility with Restyle\n- [@shopify/flash-list](https://shopify.github.io/flash-list/docs/)\n  - `FlashList` - High-performance list component with Restyle props\n- [react-native-keyboard-controller](https://www.npmjs.com/package/react-native-keyboard-controller)\n  - [`KeyboardAvoidingView`](https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-avoiding-view) - Automatically adjusts its height, position, or bottom padding based on the keyboard height to remain visible while the virtual keyboard is displayed\n  - [`KeyboardAwareScrollView`](https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-aware-scroll-view) - Effortlessly handles keyboard appearance, automatically scrolls to focused `TextInput` and provides a native-like performance\n  - [`KeyboardBackgroundView`](https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/views/keyboard-background-view) - Visual-only utility that replicates the background of the system keyboard\n  - [`KeyboardControllerView`](https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/views/keyboard-controller-view) - A plain react-native `View` with some additional methods and props\n  - [`KeyboardStickyView`](https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-sticky-view) - Seamlessly ensures that a designated view sticks to the keyboard's movements, maintaining visibility and interaction\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falloc%2Fnativ","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falloc%2Fnativ","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falloc%2Fnativ/lists"}