Применение паттернов стилизации React Native
Стилизация React Native может становиться непоследовательной между темами, экранами и платформами. Этот навык дает практические паттерны NativeWind и BrandColors для приложений Expo.
Скопируйте этот запрос в своего Агента. Он содержит каноническую страницу Skill и манифест.
Review the Skillstore skill "rn-styling" from https://skillstore.io/skills/cjharmath-rn-styling.md and its manifest at https://skillstore.io/api/skills/cjharmath-rn-styling/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Ваш Агент по-прежнему должен показать план и запросить все подтверждения, требуемые политикой безопасности.
Используйте эти ссылки, когда AI-агенту, crawler или script нужен чистый контекст вместо полной страницы.
Использование «rn-styling». Компонент карточки использует захардкоженные темные цвета и непоследовательные отступы.
Ожидаемый результат:
Использование «rn-styling». Экран формы скрывается клавиатурой и игнорирует safe area insets.
Ожидаемый результат:
Использование «rn-styling». Команда хочет checklist для ревью стилей экранов Expo.
Ожидаемый результат:
I found no evidence that the flagged backtick patterns execute commands. The references are Markdown code fences, inline code, JSX snippets, and prose in SKILL.md, so all static findings are false positives. No prompt injection, data exfiltration intent, or system reconnaissance instruction was found.
Делитесь версионным отчетом об оценке, нейтральным значком, встраиваемой карточкой и цитатами. Skillstore публикует доказательства, не решая, безопасен ли этот Skill.
https://skillstore.io/skills/cjharmath-rn-styling/audits/8?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/cjharmath-rn-styling?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/cjharmath-rn-styling?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/cjharmath-rn-styling/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/cjharmath-rn-styling.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>CJHarmath. (2026). rn-styling security audit report (audit version 8) [Author version unspecified]. Skillstore. https://skillstore.io/skills/cjharmath-rn-styling/audits/8@techreport{cjharmath-cjharmath-rn-styling-2026,
author = {CJHarmath},
title = {rn-styling security audit report (audit version 8)},
institution = {Skillstore},
year = {2026},
number = {8},
url = {https://skillstore.io/skills/cjharmath-rn-styling/audits/8},
note = {Author version unspecified}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "rn-styling security audit report (audit version 8)"
version: "unspecified"
type: report
authors:
- name: "CJHarmath"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/cjharmath-rn-styling/audits/8"
identifiers:
- type: other
value: "skillstore:cjharmath-rn-styling:audit:8"
description: "Skillstore immutable audit report identifier"
Применять согласованные решения по цветам, отступам и верстке при создании UI-компонентов React Native.
Проверять, следуют ли изменения компонентов паттернам NativeWind, BrandColors, safe area и платформенных стилей.
Проектировать использование светлой и темной тем с общими константами цветов и четкими обязанностями компонентов.
Review this React Native component style. Suggest where to use BrandColors, NativeWind classes, and StyleSheet rules.
Inspect these NativeWind class names for conflicting spacing, layout, and platform utilities. Explain which styles win and how to simplify them.
Update this screen plan for light mode, dark mode, safe areas, keyboard behavior, iOS shadows, and Android elevation.
Audit this React Native styling approach and create a migration plan from hardcoded colors to BrandColors and NativeWind layout utilities.
Автор
CJHarmathЛицензия
MIT
Ревизия Skillstore
r1
Примечание о версии
Автор не указал версию.
Ссылка
dd4a3ef9f20ddf38830950b4bb713df96b431fd6
Актуальность поддержки
18.07.2026
Использование
7 загрузок · 195 просмотров
Структура файлов
📄 SKILL.md
Оптимизация производительности React Native
Приложения React Native могут страдать от медленных списков, лишних рендеров и зависаний потока JS. Этот навык предоставляет сфокусированные паттерны для более быстрых экранов FlatList, мемоизированных компонентов, оптимизированных селекторов, кешированных изображений и профилирования.
Улучшение паттернов React-хранилищ Zustand
Команды React могут сталкиваться с устаревшим состоянием, особенностями времени рендеринга и ошибками асинхронных действий при использовании Zustand. Этот навык дает прямые паттерны для хранилищ, селекторов, производного состояния, тестирования, отладки и персистентности.
Надежное развертывание React-приложений
Настройка развертывания React может быть повторяющейся и подверженной ошибкам. Этот навык предоставляет практические примеры для Vercel, Netlify, Docker, CI/CD, окружений и мониторинга.
Создавайте надежные сторы Zustand для React Native
Команды React Native часто теряют время из-за устаревшего состояния, тайминга асинхронных действий и лишних рендеров. Этот навык предоставляет паттерны Zustand, которые упрощают понимание, тестирование и отладку поведения сторов.
Улучшение наблюдаемости React Native
Тихие сбои и слабые сообщения об ошибках затрудняют диагностику мобильных багов. Этот навык дает практические паттерны React Native для логов, ошибок, трассировки и безопасной отправки отчетов.
Проектирование надежных потоков состояния в React
Сложные потоки React часто ломаются из-за пропущенных await, скрытых переходов и слабых состояний ошибок. Этот навык помогает проектировать явные состояния, валидацию, обратную связь в UI и интеграционные тесты.
Настройка Tailwind CSS для Expo
от expo
Командам Expo нужна единообразная стилизация для native- и web-таргетов. Этот навык предоставляет сфокусированный путь настройки для Tailwind CSS v4, NativeWind v5 и react-native-css.
Оптимизация приложений React Native
от vercel-labs
Приложения React Native могут страдать от медленных списков, дерганых анимаций и ошибок, связанных с платформой. Этот навык дает Codex, Claude и Claude Code краткие правила для производительной работы с Expo и React Native.
Создание Expo Dev Clients для нативного тестирования
от expo
Командам Expo нужны надежные клиенты разработки, когда нативный код выходит за рамки Expo Go. Этот навык помогает с настройкой сборки EAS, доставкой через TestFlight, локальными сборками, установкой и базовым устранением неполадок.
Создание DOM-компонентов Expo
от expo
Командам Expo часто нужны веб-библиотеки внутри нативных приложений без их переписывания. Этот навык помогает Claude, Codex и Claude Code использовать безопасные паттерны DOM-компонентов.
Создание сетевых сценариев для Expo
от expo
Мобильным приложениям нужны надежные API-запросы, кэширование, обработка токенов и поведение в офлайн-режиме. Этот навык помогает разработчикам Expo работать с fetch, React Query, SecureStore, NetInfo и конфигурацией на основе окружения.
Безопасное обновление Expo SDK
от sickn33
Обновления Expo SDK могут нарушить работу зависимостей, конфигурации и нативного поведения. Этот skill дает структурированный план обновления с проверками пакетов, настроек приложения, API и тестирования.