К основному содержанию
скилл CX Codex

monorepo-tamagui — скилл для Claude Code: правила монорепо

Задаёт агенту правила разработки кросс-платформенного монорепо на Tamagui, Turbo, Next.js, Expo и Supabase. Пригодится, когда в одном репозитории живут веб и мобильное приложение.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add Mindrally/skills --skill monorepo-tamagui -a claude-code
Открыть на GitHub

Что делает monorepo-tamagui

Скилл описывает, как писать код в монорепо с общей кодовой базой для веба и нативной части. Агент получает набор соглашений: TypeScript с функциональным стилем, интерфейсы вместо типов, литеральные типы вместо enum, валидация схем через Zod. Для интерфейса — компоненты Tamagui и mobile-first вёрстка, чтобы стили не разъезжались между web и native.

Состояние держится на Zustand, запросы и кеш — на TanStack React Query, а useEffect рекомендуется использовать по минимуму. Локализация идёт через i18next и react-i18next на вебе и expo-localization в React Native. Структура воркспейса следует практикам Turbo, платформенный код выносится в файлы вида .native.tsx, навигация — через Solito. Отдельный блок про Stripe: платежи, подписки, Customer Portal, вебхуки и синхронизация статуса подписки с Supabase.

Это набор текстовых правил, а не генератор кода, поэтому стек он не устанавливает. Если в проекте другой стейт-менеджер или нет Supabase, часть советов придётся игнорировать вручную — скилл не подстраивается под вашу конфигурацию. Зато в команде из нескольких человек он задаёт общий язык для агента и снимает разнобой в мелочах вроде именования переменных.

Какие задачи решает

  • договориться о едином стиле TypeScript в общем репозитории
  • развести платформенный код по файлам .native.tsx
  • настроить изоляцию пакетов и общие конфиги в Turbo
  • связать подписки Stripe со статусом в Supabase
  • вынести все пользовательские строки в i18next и expo-localization

Примеры запросов агенту

  • Добавь в монорепо новый экран с общей вёрсткой для web и native на Tamagui
  • Разнеси логику оплаты подписки: Stripe, вебхуки и синхронизация с Supabase
  • Проверь структуру воркспейса и зависимости пакетов по правилам Turbo

Как установить monorepo-tamagui

1Через Skills CLI (Vercel)

npx skills add Mindrally/skills --skill monorepo-tamagui -a claude-code

2Вручную: положить файлы

~/.claude/skills/monorepo-tamagui/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/monorepo-tamagui/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о monorepo-tamagui

Как установить monorepo-tamagui в Claude?

Выполните npx skills add Mindrally/skills --skill monorepo-tamagui -a claude-code. После этого файл скилла появится по пути ~/.claude/skills/monorepo-tamagui/SKILL.md.

Что делает monorepo-tamagui?

Даёт агенту правила разработки кросс-платформенного монорепо: Tamagui для интерфейса, Zustand и TanStack React Query для состояния и данных, Turbo для структуры воркспейса, Solito для навигации.

Нужен ли Supabase и Stripe, чтобы скилл работал?

Нет, это рекомендации, а не зависимости. Блоки про Supabase и Stripe просто не будут применяться, если этих сервисов в проекте нет.

Исходный текст

SKILL.md · Apache-2.0
---
name: monorepo-tamagui
description: Monorepo development guidelines using Tamagui, Turbo, Next.js, Expo, Supabase, and cross-platform best practices.
metadata:
  maintainer: Mindrally
  source: https://github.com/Mindrally/skills
---

# Monorepo using Tamagui

Expert developer guidelines for building cross-platform applications with TypeScript, React, Next.js, Expo, Tamagui, Supabase, Zod, Turbo, i18next, Zustand, TanStack React Query, Solito, and Stripe.

## Code Style and Structure

- Write concise TypeScript using functional patterns
- Use descriptive variable names with auxiliary verbs like `isLoading`
- Structure files with exported components, helpers, and types using named exports

## TypeScript and Validation

- Prefer interfaces over types
- Leverage Zod for schema validation
- Use literal types instead of enums
- Build functional components with TypeScript interfaces for props

## UI and Styling

- Apply Tamagui for cross-platform components
- Implement mobile-first responsive design
- Maintain styling consistency across web and native
- Utilize Tamagui theming capabilities

## State Management

- Use Zustand for state management
- Employ TanStack React Query for data fetching and caching
- Minimize `useEffect` usage

## Internationalization

- Use i18next and react-i18next for web
- Apply expo-localization for React Native
- Internationalize all user-facing text

## Error Handling

- Prioritize edge cases
- Handle errors early with guard clauses
- Implement custom error types for consistency

## Performance Optimization

- Optimize both web and native platforms
- Use dynamic imports in Next.js
- Implement lazy loading
- Optimize images with proper formats

## Monorepo Structure

- Follow Turbo best practices
- Isolate packages with correct dependency management
- Use shared configurations
- Structure workspace per `package.json`

## Cross-Platform Development

- Use Solito for navigation
- Create `.native.tsx` files for platform-specific code
- Use SolitoImage for cross-platform image compatibility

## Stripe Integration

- Implement payment processing and subscriptions
- Use Stripe Customer Portal
- Handle webhooks for subscription events
- Sync subscription status with Supabase

© Mindrally · Apache-2.0 · Mindrally/skills

Похожие скиллы

Всё по теме «Фронтенд и UI» →
expo-examples expo Помогает переносить официальные примеры интеграций из каталога expo/examples в текущий проект или создавать новые приложения через шаблон. CX Codex +1 26 400установок tamagui tamagui Обучает ИИ-агента синтаксису Tamagui v3 с плоскими условиями стилей без префикса $. Помогает собирать кроссплатформенный UI для веба и React Native. CX Codex +1 595установок nextjs-supabase-auth sickn33 Скилл настраивает Supabase Auth в Next.js App Router: клиенты, middleware, OAuth callback и Server Actions. Пригодится для защиты маршрутов и работы с сессиями. CX Codex +1 6 600установок bencium-code-conventions bencium Задаёт правила Bence для React и Next.js: стек, стиль кода, тесты и рабочий процесс. Нужен при создании или настройке проекта по этим соглашениям. CX Codex +1 3 300установок git-city-3d-github-visualization reason-machines Скилл для работы над Git City — проектом, где профиль GitHub превращается в здание в 3D-городе на Next.js и Three.js. CX Codex +1 1 300установок typescript-nextjs-supabase-cursorrules-prompt-file PatrickJS Правило для Cursor, которое держит TypeScript-код на Next.js App Router и Supabase в одном стиле: серверные компоненты, Shadcn UI, Tailwind. ★ 41 011звёзд репо

Из того же набора168

clerk-authentication Правила подключения Clerk в Next.js: middleware, хуки, защита серверных действий и маршрутов API. Пригодится, когда проект уже на Clerk и нужен порядок в проверках доступа. CX Codex +1 683установок nx Скилл задаёт агенту правила работы с Nx: структура apps и libs, теги, границы модулей, генераторы и кэш. Пригодится, если проект уже собран на Nx. CX Codex +1 682установок langchain-development Задаёт агенту правила разработки на LangChain и LangGraph: композиция цепочек, агенты, память, RAG. Пригодится, когда проект на Python растёт и код надо держать в одном стиле. CX Codex +1 681установок apollo-graphql Скилл задаёт агенту правила работы с Apollo Client: запросы, мутации, фрагменты, кэш и оптимистичные обновления в React-проектах на GraphQL. CX Codex +1 677установок swiftui-development Набор правил для ИИ-агента: как строить SwiftUI-приложения на MVVM, управлять состоянием и работать с конкурентностью Swift 6. CX Codex +1 676установок react-native-cursor-rules Набор правил React Native для ИИ-агента: TypeScript, функциональные компоненты, оптимизация ререндеров и FlatList. Пригодится, когда агент пишет код для мобильного приложения. CX Codex +1 670установок netlify-development Скилл с правилами сборки и деплоя на Netlify: serverless- и edge-функции, Blobs, Image CDN, конфигурация сборки. Пригодится, когда агент пишет функции или правит netlify.toml. CX Codex +1 665установок viewcomfy-api-rules Помогает подключить ViewComfy API к веб-приложению на Python и FastAPI: разобрать параметры workflow, вызвать endpoint и сохранить готовые файлы. CX Codex +1 663установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой