React Native Developer Skills

React Native Developer Skills — vendor-neutral skills for developers and AI agents

Vendor-neutral React Native skills for developers and AI agents. Practise Spec/Skill-Driven Development (SSD) — from spec to review — with focused Markdown guides you can drop into any RN project.

Each skill is a self-contained guide with a clear "when to use", a checklist, correct/incorrect examples, and pitfalls.

What is Spec/Skill-Driven Development?

Instead of jumping straight to code, you:

Spec it — capture requirements, then design, then tasks (see the spec-authoring skill).
Build it — implement, using the focused skills (architecture, performance, state, etc.) as guidance.
Review it — audit the result with the code-review skill, which routes each concern to its focused skill.

The same skills inform all three stages: what guides the build also defines the review criteria.

Skill Index

Plan

Skill	Description
spec-authoring	Write a spec before building — requirements, design, and tasks in order, with traceability between them.

Build & review (focused areas)

Skill	Description
architecture	Folder structure, navigation, deep linking, startup order, safe area, and rendering safety.
performance	Re-renders, list virtualisation, images, animations, and memory/resource cleanup.
accessibility	Labels, roles, touch targets, focus order, colour, and dynamic type.
state-and-data	Server state, caching, offline behaviour, network transitions, transactions, and loading/empty/error states.
security	Secrets, secure storage, transport security, PII in logs, deep-link validation, and privacy compliance.
testing	Unit, component, and E2E coverage; edge cases; and test quality.
native-integration	Permissions, native modules, platform APIs, background tasks, and listener cleanup.
forms-and-validation	Form state, validation timing, keyboard handling, error focus, and submit safety.
observability	Crash reporting, breadcrumbs, performance traces, analytics, and PII-safe logging.
i18n-and-localization	Extracted strings, plurals, locale-aware formatting, RTL layout, and fallback locales.
error-handling	Error boundaries, failure UI, retry, and global handlers.
notifications	Push and local notifications, permission timing, tap routing, and payload privacy.
theming	Colour tokens, dark mode, and system appearance.
upgrades	React Native upgrades and the New Architecture.
release-and-updates	Store builds, versioning, and over-the-air JavaScript updates.

Baseline

Skill	Description
critical-rules	Crash and secret checks that apply to lines the diff touches.
conventions	Project conventions for structure, TypeScript, naming, file size, and hygiene. Apply when a change adds files or changes structure or types.

Audit

Skill	Description
code-review	Entry point that applies crash and data-loss rules on every change, and opens another skill only when the diff touches that concern.

Installation

Codex and Claude

For broad agent support, use the standard skills CLI:

npx skills add Neha/rn-developer-skills

The scripts below are a zero-dependency fallback when you want local setup without manually copying the skills/ folder.

macOS / Linux

chmod +x scripts/install.sh
./scripts/install.sh all

Windows

.\scripts\install.ps1 all

Or from cmd.exe:

scripts\install.cmd all

Install only one target when needed:

./scripts/install.sh codex
./scripts/install.sh claude

The Codex installer copies each skill folder to $HOME/.agents/skills, which current Codex docs list as the user-level skills directory. Override with --codex-dir or CODEX_SKILLS_DIR if your Codex setup uses a different location.

The Claude installer copies each skill folder to $HOME/.claude/skills and also writes uploadable ZIP files to dist/claude/. Override the local copy location with --claude-dir or CLAUDE_SKILLS_DIR if your Claude setup expects a different skills directory. For Claude.ai, upload the generated ZIP files from Customize → Skills.

Claude Code marketplace

This repository is also a Claude Code plugin marketplace. From a shell:

claude plugin marketplace add Neha/rn-developer-skills
claude plugin install rn-developer-skills@rn-developer-skills

Listing in Anthropic's public plugin directory is a separate submission from the repository owner. Local and GitHub installs above do not require that listing.

By default, existing installed skill folders are left untouched. Add --force on macOS/Linux or -Force on Windows to replace them. A copy installed earlier stays at that old version until you pass --force or reinstall the plugin.

A plugin install and a copied folder are separate copies. Cursor loads every copy it finds, including a plugin, ~/.cursor/skills, and skills it picks up from Claude or Codex folders. It does not pick the newer one. Claude Code namespaces a plugin skill as plugin-name:skill-name, so it loads beside a same-named skill in ~/.claude/skills instead of replacing it. When names collide outside a plugin, Claude Code uses the enterprise skill over the personal one, and the personal one over the project one. Keep a single copy: use the plugin and delete the copied folder, or update the folder with --force and do not also enable the plugin. In Cursor, Settings → Rules, Skills and Subagents → Include Third-Party Plugins, Skills, and Other Configs stops it from also reading other tools' skill folders.

Cursor (recommended)

Requires Cursor 3.9+ (Plugins and the Customize page). This repository is packaged as a Cursor plugin for one-click install from the marketplace.

From the Cursor Marketplace (after listing approval)

Open the Agents view.
Click Customize in the left sidebar.
Open the Plugins tab, search for React Native Developer Skills, and click Install.

Shortcut: Cmd+Shift+P → Cursor: Open Plugin Marketplace

Test locally before submission

Clone this repo and load it as a local plugin:

git clone https://github.com/Neha/rn-developer-skills.git
ln -s "$(pwd)/rn-developer-skills" ~/.cursor/plugins/local/rn-developer-skills

Reload Cursor: Cmd+Shift+P → Developer: Reload Window
Open Customize → Skills and confirm all 19 skills appear.
Invoke a skill in chat, e.g. /spec-authoring or /code-review.

Team Marketplace (Cursor Teams/Enterprise)

Admins import the repo under Dashboard → Settings → Plugins → Team Marketplaces → Add Marketplace → Import from Repo, then assign it to a distribution group.

To submit this plugin for public listing, see cursor.com/marketplace/publish.

Kiro

This repository is an Agent Plugin Kiro can install as a power. plugin.json at the repo root is the manifest; skills stay in skills/.

In Kiro, open the Powers panel, choose Add Custom Power, then Import power from GitHub, and use https://github.com/Neha/rn-developer-skills. Keywords such as react-native and code-review activate it.

This repository is submitted to the Kiro powers registry (confirmation 1819c6dd-f8ef-4d05-9a22-5c2420612364). Kiro emails the author if it is accepted; the listing would then appear at kiro.dev/powers. GitHub import above does not wait on that review.

Manual / other tools

These skills are plain Markdown, so you can adopt them in whichever way suits your workflow:

Clone or copy this repository (or just the skills/ folder) into your project, for example under .cursor/skills/, .kiro/, or a docs/ directory.
Point your agent or team at them. If you use an AI development tool that supports skills, place skills/ where the tool expects them.
Reference a skill when you work. Open the relevant SKILL.md (or ask your agent to apply it) when planning, building, or reviewing.
Run validation (optional) to keep contributions consistent:
```
node scripts/validate-skills.mjs
```
Validates skill frontmatter, README index coverage, and .cursor-plugin/plugin.json against the Cursor schema.

Using a Skill

Each SKILL.md follows the same shape, so any skill is predictable to navigate:

When to Use — the situations the skill applies to.
Guidance — checklists and explanations, with correct/incorrect examples.
Anti-Patterns (where useful) — a table of common mistakes and their fixes.
Pitfalls — subtle gotchas the checklist alone does not catch.

Start with spec-authoring for a new feature, use only the focused skills the feature touches, and finish with code-review.

Examples:

Login screen: spec-authoring, then forms-and-validation, security, accessibility, and error-handling, then testing, then code-review.
New list screen: spec-authoring, then architecture, performance, accessibility, and state-and-data, then testing, then code-review.
React Native bump: upgrades, then testing, then release-and-updates if a store build is part of the same change.

Repository Layout

.cursor-plugin/   Cursor marketplace manifest (plugin.json)
.claude-plugin/   Claude Code plugin and marketplace manifests
plugin.json       Kiro / Agent Plugins manifest
docs/             contributor guides (skill authoring walkthrough)
schemas/          JSON Schema for plugin manifest validation
skills/            one folder per skill, each with a SKILL.md
templates/         starting points for new skills and specs
scripts/           validation tooling
assets/            logo and announcement image

Contributing

See CONTRIBUTING.md for how to propose a new skill or edit an existing one, including the required SKILL.md structure and frontmatter. New skills should pass node scripts/validate-skills.mjs and be added to the Skill Index above. Pull requests get an automated first pass from CodeRabbit once the GitHub App is installed; see CONTRIBUTING.md.

Privacy

This collection does not collect personal data. See the privacy policy.

Support

Open a GitHub issue or email nsharma215@gmail.com.

License

MIT