{"id":41215573,"url":"https://github.com/callstackincubator/agent-skills","last_synced_at":"2026-06-13T19:35:15.851Z","repository":{"id":333343900,"uuid":"1134388286","full_name":"callstackincubator/agent-skills","owner":"callstackincubator","description":"A collection of agent-optimized React Native skills for AI coding assistants.","archived":false,"fork":false,"pushed_at":"2026-06-02T20:59:32.000Z","size":7423,"stargazers_count":1429,"open_issues_count":13,"forks_count":99,"subscribers_count":15,"default_branch":"main","last_synced_at":"2026-06-13T19:35:12.166Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Shell","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/callstackincubator.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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":"AGENTS.md","dco":null,"cla":null}},"created_at":"2026-01-14T16:45:39.000Z","updated_at":"2026-06-13T17:11:44.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/callstackincubator/agent-skills","commit_stats":null,"previous_names":["callstackincubator/agent-skills"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/callstackincubator/agent-skills","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/callstackincubator%2Fagent-skills","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/callstackincubator%2Fagent-skills/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/callstackincubator%2Fagent-skills/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/callstackincubator%2Fagent-skills/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/callstackincubator","download_url":"https://codeload.github.com/callstackincubator/agent-skills/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/callstackincubator%2Fagent-skills/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34298247,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-13T02:00:06.617Z","response_time":62,"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":[],"created_at":"2026-01-23T00:00:42.690Z","updated_at":"2026-06-13T19:35:15.844Z","avatar_url":"https://github.com/callstackincubator.png","language":"Shell","funding_links":[],"categories":["Skills Catalog","Shell","🧠 Claude Skills","🧩 Skills","Frontend Development","Mobile / React Native","Other","Framework Skills"],"sub_categories":["Frontend (24)","By Platform","Remix / React Router"],"readme":"# Agent Skills\n\nA collection of agent-optimized skills for AI coding assistants. The repo ships raw Agent Skills for assistants that can read `skills/` directly, plus marketplace metadata for both Claude Code and Codex plugin workflows.\n\n## Available Skills\n\n| Skill                                                                | Description                                             |\n| -------------------------------------------------------------------- | ------------------------------------------------------- |\n| [react-native-best-practices](./skills/react-native-best-practices/) | React Native optimization best practices from Callstack |\n| [github](./skills/github/)                                           | GitHub workflow patterns for PRs, code review, branching |\n| [github-actions](./skills/github-actions/)                           | GitHub Actions workflow patterns for React Native simulator/emulator build artifacts |\n| [upgrading-react-native](./skills/upgrading-react-native/)           | React Native upgrade workflow: templates, dependencies, and common pitfalls |\n| [react-native-brownfield-migration](./skills/react-native-brownfield-migration/) | Incremental migration strategy to adopt React Native or Expo in native apps using @callstack/react-native-brownfield, with setup, packaging, and phased integration steps |\n\n## React Native Best Practices\n\nPerformance optimization skills based on [**The Ultimate Guide to React Native Optimization**](https://www.callstack.com/ebooks/the-ultimate-guide-to-react-native-optimization) by [Callstack](https://www.callstack.com/).\n\nCovers:\n\n- **JavaScript/React**: Profiling, FPS, re-renders, lists, state management, animations\n- **Native**: iOS/Android profiling, TTI, memory management, Turbo Modules\n- **Bundling**: Bundle analysis, tree shaking, R8, app size optimization\n\n### Quick Start\n\n#### Claude Code\n\nUse the Claude Code marketplace metadata in `.claude-plugin/marketplace.json`.\n\n**1. Add the marketplace:**\n\n```bash\n/plugin marketplace add callstackincubator/agent-skills\n```\n\n**2. Install the skill you want:**\n\n```bash\n/plugin install react-native-best-practices@callstack-agent-skills\n```\n\nOther available installs:\n\n```bash\n/plugin install github@callstack-agent-skills\n/plugin install github-actions@callstack-agent-skills\n/plugin install upgrading-react-native@callstack-agent-skills\n/plugin install react-native-brownfield-migration@callstack-agent-skills\n```\n\nOr use the interactive menu:\n\n```bash\n/plugin menu\n```\n\n**For local development:**\n\n```bash\nclaude --plugin-dir ./path/to/agent-skills\n```\n\nOnce installed, Claude will automatically load the relevant skill based on the task.\n\n#### OpenAI Codex\n\nThis repo supports Codex in two different ways.\n\n**Option 1: Add the bundled Codex plugins**\n\nCodex can add the bundled plugins from this repository automatically using `.agents/plugins/marketplace.json`, so a separate install script is not needed.\n\n**Option 2: Install standalone skills**\n\nAll major AI coding assistants support the Agent Skills standard.\n\n**Install via skill-installer:**\n\n```\n$skill-installer install react-native-best-practices from callstackincubator/agent-skills\n```\n\n**Or clone manually:**\n\n```bash\n# Project-level\ngit clone https://github.com/callstackincubator/agent-skills.git\ncp -r agent-skills/skills/* .codex/skills/\n\n# User-level\ncp -r agent-skills/skills/* ~/.codex/skills/\n```\n\nRestart Codex to recognize newly installed skills.\n\n**Usage:** Type `$` to mention a skill or use `/skills` command.\n\nThese skills include `agents/openai.yaml` metadata for Codex Skills UI compatibility.\n\n#### Other AI Assistants\n\n##### Cursor\n\n**Option 1: Import rules from GitHub**\n\nCursor’s GitHub / GitLab rule importer only discovers **`.mdc` files** (typically under `.cursor/rules/`). This repository includes those files so import succeeds.\n\n1. Open Cursor Settings (`Cmd+Shift+J` / `Ctrl+Shift+J`)\n2. Navigate to **Rules** and use **Import rules from GitHub** (wording may vary by version), or add a remote rule from a Git URL\n3. Enter: `https://github.com/callstackincubator/agent-skills.git`\n\nImported rules are short Cursor **project rules**; they point at the full Agent Skills under `skills/`. Clone or copy the `skills/` tree into your workspace when you want the model to read the complete markdown skills locally (see Option 2).\n\n**Option 2: Local Installation**\n\n```bash\n# Project-level\ngit clone https://github.com/callstackincubator/agent-skills.git .cursor/skills/agent-skills\n\n# User-level (available in all projects)\ngit clone https://github.com/callstackincubator/agent-skills.git ~/.cursor/skills/agent-skills\n```\n\n**Usage:** Type `/` in Agent chat to search and select skills by name.\n\n##### Gemini CLI\n\n**Install from repository:**\n\n```bash\ngemini skills install https://github.com/callstackincubator/agent-skills.git\n```\n\n**Or install to workspace:**\n\n```bash\ngemini skills install https://github.com/callstackincubator/agent-skills.git --scope workspace\n```\n\n**Management commands:**\n- `/skills list` - view all discovered skills\n- `/skills enable \u003cname\u003e` / `/skills disable \u003cname\u003e` - toggle availability\n- `/skills reload` - refresh skill inventory\n\n##### OpenCode\n\nClone to any supported skills directory:\n\n```bash\n# Project-level\ngit clone https://github.com/callstackincubator/agent-skills.git\ncp -r agent-skills/skills/* .opencode/skill/\n\n# User-level\ncp -r agent-skills/skills/* ~/.config/opencode/skill/\n```\n\nOpenCode also discovers Claude-compatible paths (`.claude/skills/`, `~/.claude/skills/`).\n\n**Permission control** in `opencode.json`:\n\n```json\n{\n  \"permission\": {\n    \"skill\": {\n      \"*\": \"allow\"\n    }\n  }\n}\n```\n\n##### Other Assistants\n\nFor assistants without native skills support, point them to the skill file:\n\n```\nRead skills/react-native-best-practices/SKILL.md for React Native performance guidelines\n```\n\nOr reference specific topics:\n\n```\nLook up js-profile-react.md for React DevTools profiling instructions\n```\n\n### Code Examples\n\nThe [callstack/optimization-best-practices](https://github.com/callstack/optimization-best-practices) repository contains runnable code examples for:\n\n- React Compiler setup\n- Dedicated React Native SDKs vs web polyfills\n- R8 code shrinking on Android\n\n## Other AI Assistants\n\nSee [AI Assistant Integration Guide](./docs/ai-assistant-integration.md) for detailed setup instructions with Cursor, GitHub Copilot, Claude API, ChatGPT, and other AI coding assistants.\n\n## Structure\n\n### Repo Structure\n\n```\nagent-skills/\n├── .cursor/\n│   └── rules/                 # Cursor importable project rules (.mdc) for “Import rules from GitHub”\n├── .claude-plugin/\n│   └── marketplace.json     # Claude Code marketplace definition\n├── .agents/\n│   └── plugins/\n│       └── marketplace.json # Codex marketplace definition for bundled plugins\n├── plugins/\n│   ├── building-react-native-apps/\n│   └── testing-react-native-apps/\n└── skills/\n    ├── react-native-best-practices/\n    │   ├── SKILL.md              # Main skill file with quick reference\n    │   └── references/           # Detailed skill files\n    │       ├── images/           # Visual references for profilers, diagrams\n    │       ├── js-*.md           # JavaScript/React skills\n    │       ├── native-*.md       # Native iOS/Android skills\n    │       └── bundle-*.md       # Bundling \u0026 app size skills\n    │\n    ├── github/\n    │   ├── SKILL.md              # Main skill file with PR workflow patterns\n    │   └── references/           # Detailed GitHub workflow files\n    │\n    ├── github-actions/\n    │   ├── SKILL.md              # Main skill file for GitHub Actions build artifacts\n    │   ├── agents/openai.yaml    # Codex Skills UI metadata\n    │   └── references/           # iOS/Android action templates and download flows\n    │\n    ├── upgrading-react-native/\n    │   ├── SKILL.md              # Main skill file with RN upgrade workflow routing\n    │   └── references/           # Detailed upgrade flow files\n    │\n    └── react-native-brownfield-migration/\n        ├── SKILL.md              # Main skill file for Expo/bare path routing\n        ├── agents/openai.yaml    # Codex Skills UI metadata\n        └── references/           # Brownfield packaging and integration flow files\n```\n\nUse `.claude-plugin/marketplace.json` for Claude Code plugin installs and `.agents/plugins/marketplace.json` for Codex plugin installs.\n\nThe standalone `skills/` directory contains repo-local skills. The `plugins/` directory contains installable Codex plugin bundles.\n\n## Contributing\n\nContributions welcome! Skills should be:\n\n- **Actionable**: Step-by-step instructions, not theory\n- **Searchable**: Clear headings and keywords\n- **Complete**: Include code examples and common pitfalls\n\nWhen adding or editing skills, follow the [agentskills.io specification](https://agentskills.io/specification) and [Claude Code best practices](https://platform.claude.com/docs/en/agents-and-tools/agent-skills/best-practices). The maintainer checklist lives in [AGENTS.md](./AGENTS.md), with supporting details in [docs/skill-conventions.md](./docs/skill-conventions.md).\n\n## Roadmap / Work in Progress\n\nThis is just the start! The following features are planned or in progress.\n\n### Device Verification and Visual Feedback\n\nSeveral skills involve driving app flows or interpreting visual profiler output (flame graphs, treemaps, memory snapshots). Agents should use `agent-device` to open apps, navigate scenarios, capture snapshots/screenshots, and collect logs or other evidence.\n\nProfiler-specific GUI analysis may still require exported reports or human review when the device automation surface cannot inspect the profiler UI directly.\n\n**Affected skills:**\n\n- `js-profile-react.md` - React DevTools flame graphs\n- `js-measure-fps.md` - FPS graphs and performance overlays\n- `native-profiling.md` - Xcode Instruments / Android Studio Profiler\n- `native-measure-tti.md` - TTI timeline visualization\n- `native-view-flattening.md` - View hierarchy inspection\n- `bundle-analyze-js.md` - Bundle treemap visualization\n- `bundle-analyze-app.md` - App size breakdown (Emerge Tools, Ruler)\n\n**Agent reference:** if the environment exposes an `agent-device` skill, read it first. If the CLI is available, follow `agent-device help workflow` before writing exact commands. If `agent-device` is missing and device verification is needed, install it through the environment's approved/trusted path or ask the user to install or enable it.\n\n### Complementary Skills\n\nFor complete coverage, consider pairing with:\n\n- [Vercel React Best Practices](https://github.com/vercel-labs/agent-skills/tree/react-best-practices/skills/react-best-practices) - React/Next.js web optimization (40+ rules)\n\n### Future Work\n\n- [ ] Broader visual profiler feedback integration\n- [ ] Additional skills for debugging, testing, and CI/CD\n- [ ] More code examples and interactive tutorials\n\n---\n\n## Made with ❤️ at Callstack\n\nReact Native performance skills based on The Ultimate Guide to React Native Optimization.\n\n[Callstack](https://www.callstack.com/) is a group of React and React Native experts. Contact us at [hello@callstack.com](mailto:hello@callstack.com) if you need help with performance optimization or just want to say hi!\n\nLike what we do? ⚛️ [Join the Callstack team](https://www.callstack.com/careers) and work on amazing React Native projects!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcallstackincubator%2Fagent-skills","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcallstackincubator%2Fagent-skills","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcallstackincubator%2Fagent-skills/lists"}