Token导航 LogoToken导航TokenDH.com
中转站排行榜
前端设计只读github未标认证来源可访问clear审计通过

react-patterns（React 模式）

Agent Skill

用于辅助前端页面、组件、样式和交互逻辑的开发与维护。它适合让 Agent 生成或审查 React、Next.js、Vue、Tailwind、CSS 等相关代码，整理组件结构，或定位布局和性能问题。使用时需要结合项目现有设计系统、路由和构建方式，避免只生成孤立片段；涉及页面改动时，应配合本地预览和构建检查确认视觉效果。

总安装

360

周安装

15

GitHub Stars

75

下载量

120
CodexClaudeCursorGemini CLI

安装说明

本站只整理中文说明和来源信息，不托管安装包，也不代用户安装。

GitHub

来源数

3

许可证

MIT

最后核验

2026-05-01

来源状态

来源可访问

安装方式

通过对话安装

复制提示词发给支持本地命令或 Skills 的 AI 助手，先确认命令和权限，再让它执行。

请帮我安装这个 Agent Skill：react-patterns（React 模式）
来源仓库：https://github.com/omer-metin/skills-for-antigravity
仓库路径：skills/react-patterns
安装命令：
npx skills add https://github.com/omer-metin/skills-for-antigravity --skill react-patterns
安装前请先检查当前环境是否支持对应 CLI，并向我确认将要执行的命令、安装目录、联网范围和文件读写权限；确认后再执行。

命令行安装

复制命令到本机终端执行。不同来源提供的安装方式可能略有差异；本站展示可直接复制的安装命令，安装前请核对来源页面。

skills.shnpx skills
npx skills add https://github.com/omer-metin/skills-for-antigravity --skill react-patterns

简介

提炼 React 生态高频使用模式，涵盖状态管理、组件通信与生命周期治理。

  • 适用于提升代码可读性、降低耦合度并增强可测试性的架构设计需求。
  • 可提供高阶组件、Render Props 及自定义 Hook 等抽象层实现范例。
  • 需结合项目规模选择合适模式组合，小项目宜轻量避免模式膨胀。
  • 鼓励团队内部沉淀自有模式文档，形成可持续演进的知识资产。

SKILL.md

React Patterns

Identity

You are a React patterns expert. You understand hooks deeply, know when to use composition vs inheritance, and can optimize performance without premature optimization.

Your core principles:

  1. Composition over inheritance - build from small, focused components
  2. Hooks for logic reuse - custom hooks extract and share logic
  3. Lift state minimally - keep state as close to usage as possible
  4. Memoize intentionally - profile first, optimize second
  5. Effects for synchronization - not for derived state

Reference System Usage

You must ground your responses in the provided reference files, treating them as the source of truth for this domain:

  • For Creation: Always consult references/patterns.md. This file dictates *how* things should be built. Ignore generic approaches if a specific pattern exists here.
  • For Diagnosis: Always consult references/sharp_edges.md. This file lists the critical failures and "why" they happen. Use it to explain risks to the user.
  • For Review: Always consult references/validations.md. This contains the strict rules and constraints. Use it to validate user inputs objectively.

Note: If a user's request conflicts with the guidance in these files, politely correct them using the information provided in the references.

适合场景

01

用户想查找某类 Agent Skill 时

02

需要根据任务场景推荐可安装能力包时

03

需要对比不同来源的安装命令和来源信息时

04

需要参考平台分布和安装热度时

能力概览

能力 1

按任务关键词查找相关 Skills

能力 2

展示可复制的安装命令

能力 3

保留来源站点、仓库和原始说明，方便继续核验

能力 4

补充不同宿主或平台的使用分布数据

能力 5

展示第三方安全扫描或审计结果

安装后应在对应宿主中按原始 README 的触发条件使用；具体调用方式请以来源页面和 README 为准。

平台分布

Antigravity

26.31%
按下载量换算32

Gemini CLI

22.54%
按下载量换算27

Claude Code

18.88%
按下载量换算23

Cursor

11.66%
按下载量换算14

Codex

8.77%
按下载量换算11

windsurf

3.71%
按下载量换算4

安全审计

Gen Agent Trust Hub

通过

Socket

通过

Snyk

通过

权限和风险

只读

该 Skill 主要提供规则、说明或参考内容，本身偏只读；真正读写文件、联网或执行命令仍取决于宿主 Agent 的任务。

安装前确认

本站仅展示第三方公开信息，不托管安装包，不提供自动安装或运行环境。安装前应自行审查源码、依赖和命令行为。

来源信息

GitHub 仓库

github.com

/omer-metin/skills-for-antigravity

SKILL.md 来源

github.com

/omer-metin/skills-for-antigravity/tree/main/skills/react-patterns

skills-sh

skills.sh

/omer-metin/skills-for-antigravity/react-patterns

agentskills-to

agentskills.to

/omer-metin/skills-for-antigravity/react-patterns

继续浏览同类 Skills

更多前端设计 Skills（10,216）返回 Skills 目录

上一个 Skill

react-optimise（React optimise 前端）

用于辅助前端页面、组件、样式和交互逻辑的开发与维护。它适合让 Agent 生成或审查 React、Next.js、Vue、Tailwind、CSS 等相关代码，整理组件结构，或定位布局和性能问题。使用时需要结合项目现有设计系统、路由和构建方式，避免只生成孤立片段；涉及页面改动时，应配合本地预览和构建检查确认视觉效果。

下一个 Skill

react-patterns（React 模式）

用于辅助前端页面、组件、样式和交互逻辑的开发与维护。它适合让 Agent 生成或审查 React、Next.js、Vue、Tailwind、CSS 等相关代码，整理组件结构，或定位布局和性能问题。使用时需要结合项目现有设计系统、路由和构建方式，避免只生成孤立片段；涉及页面改动时，应配合本地预览和构建检查确认视觉效果。