Web Artifacts Builder
anthropics/skills
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
React 19 performance patterns and composition architecture for Vite + Cloudflare projects.
Install React Patterns
$ npx skills add jezweb/claude-skills --skill react-patterns -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install jezweb/claude-skills react-patterns --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/jezweb/claude-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/frontend/skills/react-patterns .claude/skills/react-patterns && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "react-patterns" agent skill from https://github.com/jezweb/claude-skills/tree/main/plugins/frontend/skills/react-patterns into .claude/skills/react-patterns/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-patterns", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/jezweb/claude-skills/tree/main/plugins/frontend/skills/react-patternsType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add jezweb/claude-skills --skill react-patterns -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install jezweb/claude-skills react-patterns --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jezweb/claude-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/plugins/frontend/skills/react-patterns .agents/skills/react-patterns && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "react-patterns" agent skill from https://github.com/jezweb/claude-skills/tree/main/plugins/frontend/skills/react-patterns into .agents/skills/react-patterns/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-patterns", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add jezweb/claude-skills --skill react-patterns -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install jezweb/claude-skills react-patterns --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jezweb/claude-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/plugins/frontend/skills/react-patterns .cursor/skills/react-patterns && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "react-patterns" agent skill from https://github.com/jezweb/claude-skills/tree/main/plugins/frontend/skills/react-patterns into .cursor/skills/react-patterns/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-patterns", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/jezweb/claude-skills.git --path plugins/frontend/skills/react-patterns--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add jezweb/claude-skills --skill react-patterns -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install jezweb/claude-skills react-patterns --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jezweb/claude-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/plugins/frontend/skills/react-patterns .gemini/skills/react-patterns && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "react-patterns" agent skill from https://github.com/jezweb/claude-skills/tree/main/plugins/frontend/skills/react-patterns into .gemini/skills/react-patterns/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-patterns", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install jezweb/claude-skills react-patternsInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add jezweb/claude-skills --skill react-patterns -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/jezweb/claude-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/plugins/frontend/skills/react-patterns .github/skills/react-patterns && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "react-patterns" agent skill from https://github.com/jezweb/claude-skills/tree/main/plugins/frontend/skills/react-patterns into .github/skills/react-patterns/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-patterns", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add jezweb/claude-skills --skill react-patterns -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install jezweb/claude-skills react-patterns --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jezweb/claude-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/plugins/frontend/skills/react-patterns .opencode/skills/react-patterns && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "react-patterns" agent skill from https://github.com/jezweb/claude-skills/tree/main/plugins/frontend/skills/react-patterns into .opencode/skills/react-patterns/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-patterns", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
react-patterns- GitHub stars
- 1.1k
- Token cost
- ~2.3k tokens
- SKILL.md length
- 981 words
- Files
- 1
- Skills in repo
- 52
- Repo updated
- First seen
- Licence
- MIT
At a glance
React 19 performance patterns and composition architecture for Vite + Cloudflare projects.
- Works in 8 steps: Eliminating Waterfalls (CRITICAL) → Bundle Size (CRITICAL) → Composition Architecture (HIGH) → …
- Refactoring React components
- SKILL.md covers When to Apply, 1. Eliminating Waterfalls…, 2. Bundle Size (CRITICAL) and 3. Composition Architecture…, plus 6 more sections
- Calls npx
What it does
React Patterns is an agent skill from jezweb/claude-skills. React 19 performance patterns and composition architecture for Vite + Cloudflare projects. 50+ rules ranked by impact — eliminating waterfalls, bundle optimisation, re-render prevention, composition over boolean props, server/client boundaries, and React 19 APIs. Use when writing, reviewing, or refactoring React components. Triggers: 'react patterns', 'react review', 'react performance', 'optimise components', 'react best practices', 'composition patterns', 'why is it slow', 'reduce re-renders', 'fix waterfall'.
Its SKILL.md is about 2.3k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts. Compatibility notes: claude-code-only
It sits in Frontend & Design, covering React components. It works with React, Vite and Cloudflare. The repository describes itself as: Skills for Claude Code CLI such as full stack dev Cloudflare, React, Tailwind v4, and AI integrations. The licence is MIT.
When your agent uses it
- Refactoring React components
- Tasks that involve React components
Example prompts
- “react patterns”
- “react review”
- “react performance”
- “/react-patterns”
Requirements
- Node.js
- Compatibility (from SKILL.md): claude-code-only
- Pre-approved tools (allowed-tools): Read, Glob, Grep
Workflow steps
8 steps, taken from the step headings in SKILL.md.
What it can do on your machine
Read from SKILL.md and the folder at commit 64965d9. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves these tools, so the agent can use them without asking each time:
ReadGlobGrep
From allowed-tools in the SKILL.md frontmatter.
Runs code
Shell commands in SKILL.md call:
npx
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md. Its commands use npx, which can reach the network depending on how they are called.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Compatibility
claude-code-only
From compatibility in the SKILL.md frontmatter.
Context cost
React Patterns loads about 2.3k tokens when it runs. Until then it costs about 133 tokens; SKILL.md has 981 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from jezweb/claude-skills at commit 64965d9, republished under its MIT licence (© jezweb). 981 words, ~2,342 tokens.
Download SKILL.mdSave it as
.claude/skills/react-patterns/SKILL.md (or your agent's skills folder).- name
- react-patterns
- description
- React 19 performance patterns and composition architecture for Vite + Cloudflare projects. 50+ rules ranked by impact — eliminating waterfalls, bundle optimisation, re-render prevention, composition over boolean props, server/client boundaries, and React 19 APIs. Use when writing, reviewing, or refactoring React components. Triggers: 'react patterns', 'react review', 'react performance', 'optimise components', 'react best practices', 'composition patterns', 'why is it slow', 'reduce re-renders', 'fix waterfall'.
- allowed-tools
- Read, Glob, Grep
- compatibility
- claude-code-only
React Patterns
Performance and composition patterns for React 19 + Vite + Cloudflare Workers projects. Use as a checklist when writing new components, a review guide when auditing existing code, or a refactoring playbook when something feels slow or tangled.
Rules are ranked by impact. Fix CRITICAL issues before touching MEDIUM ones.
When to Apply
- Writing new React components or pages
- Reviewing code for performance issues
- Refactoring components with too many props or re-renders
- Debugging "why is this slow?" or "why does this re-render?"
- Building reusable component libraries
- Code review before merging
1. Eliminating Waterfalls (CRITICAL)
Sequential async calls where they could be parallel. The #1 performance killer.
| Pattern | Problem | Fix |
|---|---|---|
| Await in sequence | const a = await getA(); const b = await getB(); | const [a, b] = await Promise.all([getA(), getB()]); |
| Fetch in child | Parent renders, then child fetches, then grandchild fetches | Hoist fetches to the highest common ancestor, pass data down |
| Suspense cascade | Multiple Suspense boundaries that resolve sequentially | One Suspense boundary wrapping all async siblings |
| Await before branch | const data = await fetch(); if (condition) { use(data); } | Move await inside the branch — don't fetch what you might not use |
| Import then render | const Component = await import('./Heavy'); return <Component /> | Use React.lazy() + <Suspense> — renders fallback instantly |
How to find them: Search for await in components. Each await is a potential waterfall. If two awaits are independent, they should be parallel.
2. Bundle Size (CRITICAL)
Every KB the user downloads is a KB they wait for.
| Pattern | Problem | Fix |
|---|---|---|
| Barrel imports | import { Button } from '@/components' pulls the entire barrel file | import { Button } from '@/components/ui/button' — direct import |
| No code splitting | Heavy component loaded on every page | React.lazy(() => import('./HeavyComponent')) + <Suspense> |
| Third-party at load | Analytics/tracking loaded before the app renders | Load after hydration: useEffect(() => { import('./analytics') }, []) |
| Full library import | import _ from 'lodash' (70KB) | import debounce from 'lodash/debounce' (1KB) |
| Lucide tree-shaking | import * as Icons from 'lucide-react' (all icons) | Explicit map: import { Home, Settings } from 'lucide-react' |
| Duplicate React | Library bundles its own React → "Cannot read properties of null" | resolve.dedupe: ['react', 'react-dom'] in vite.config.ts |
How to find them: npx vite-bundle-visualizer — shows what's in your bundle.
3. Composition Architecture (HIGH)
How you structure components matters more than how you optimise them.
| Pattern | Problem | Fix |
|---|---|---|
| Boolean prop explosion | <Card isCompact isClickable showBorder hasIcon isLoading> | Explicit variants: <CompactCard>, <ClickableCard> |
| Compound components | Complex component with 15 props | Split into <Dialog>, <Dialog.Trigger>, <Dialog.Content> with shared context |
| renderX props | <Layout renderSidebar={...} renderHeader={...} renderFooter={...}> | Use children + named slots: <Layout><Sidebar /><Header /></Layout> |
| Lift state | Sibling components can't share state | Move state to parent or context provider |
| Provider implementation | Consumer code knows about state management internals | Provider exposes interface { state, actions, meta } — implementation hidden |
| Inline components | function Parent() { function Child() { ... } return <Child /> } | Define Child outside Parent — inline components remount on every render |
The test: If a component has more than 5 boolean props, it needs composition, not more props.
4. Re-render Prevention (MEDIUM)
Not all re-renders are bad. Only fix re-renders that cause visible jank or wasted computation.
| Pattern | Problem | Fix |
|---|---|---|
| Default object/array props | function Foo({ items = [] }) → new array ref every render | Hoist: const DEFAULT = []; function Foo({ items = DEFAULT }) |
| Derived state in effect | useEffect(() => setFiltered(items.filter(...)), [items]) | Derive during render: const filtered = useMemo(() => items.filter(...), [items]) |
| Object dependency | useEffect(() => {...}, [config]) fires every render if config is {} | Use primitive deps: useEffect(() => {...}, [config.id, config.type]) |
| Subscribe to unused state | Component reads { user, theme, settings } but only uses user | Split context or use selector: useSyncExternalStore |
| State for transient values | const [mouseX, setMouseX] = useState(0) on mousemove | Use useRef for values that change frequently but don't need re-render |
| Inline callback props | <Button onClick={() => doThing(id)} /> — new function every render | useCallback or functional setState: <Button onClick={handleClick} /> |
How to find them: React DevTools Profiler → "Why did this render?" or <React.StrictMode> double-renders in dev.
Show full SKILL.md (373 more words)Show less
5. React 19 Specifics (MEDIUM)
Patterns that changed or are new in React 19.
| Pattern | Old (React 18) | New (React 19) |
|---|---|---|
| Form state | useFormState | useActionState — renamed |
| Ref forwarding | forwardRef((props, ref) => ...) | function Component({ ref, ...props }) — ref is a regular prop |
| Context | useContext(MyContext) | use(MyContext) — works in conditionals and loops |
| Pending UI | Manual loading state | useTransition + startTransition for non-urgent updates |
| Route-level lazy | Works with createBrowserRouter only | Still true — <Route lazy={...}> is silently ignored with <BrowserRouter> |
| Optimistic updates | Manual state management | useOptimistic hook |
| Metadata | Helmet or manual <head> management | <title>, <meta>, <link> in component JSX — hoisted to <head> automatically |
6. Rendering Performance (MEDIUM)
| Pattern | Problem | Fix |
|---|---|---|
| Layout shift on load | Content jumps when async data arrives | Skeleton screens matching final layout dimensions |
| Animate SVG directly | Janky SVG animation | Wrap in <div>, animate the div instead |
| Large list rendering | 1000+ items in a table/list | @tanstack/react-virtual for virtualised rendering |
| content-visibility | Long scrollable content renders everything upfront | content-visibility: auto on off-screen sections |
| Conditional render with && | {count && <Items />} renders 0 when count is 0 | Use ternary: {count > 0 ? <Items /> : null} |
7. Data Fetching (MEDIUM)
| Pattern | Problem | Fix |
|---|---|---|
| No deduplication | Same data fetched by 3 components | TanStack Query or SWR — automatic dedup + caching |
| Fetch on mount | useEffect(() => { fetch(...) }, []) — waterfalls, no caching, no dedup | TanStack Query: useQuery({ queryKey: ['users'], queryFn: fetchUsers }) |
| No optimistic update | User clicks save, waits 2 seconds, then sees change | useMutation with onMutate for instant visual feedback |
| Stale closure in interval | setInterval captures stale state | useRef for the interval ID and current values |
| Polling without cleanup | setInterval in useEffect without clearInterval | Return cleanup: useEffect(() => { const id = setInterval(...); return () => clearInterval(id); }) |
8. Vite + Cloudflare Specifics (MEDIUM)
| Pattern | Problem | Fix |
|---|---|---|
import.meta.env in Node scripts | Undefined — only works in Vite-processed files | Use loadEnv() from vite |
| React duplicate instance | Library bundles its own React | resolve.dedupe + optimizeDeps.include in vite.config.ts |
| Radix Select empty string | <SelectItem value=""> throws | Use sentinel: <SelectItem value="__any__"> |
| React Hook Form null | {...field} passes null to Input | Spread manually: value={field.value ?? ''} |
| Env vars at edge | process.env doesn't exist in Workers | Use c.env (Hono context) or import.meta.env (Vite build-time) |
Using as a Review Checklist
When reviewing code, go through categories 1-3 (CRITICAL + HIGH) for every PR. Categories 4-8 only when performance is a concern.
/react-patterns [file or component path]Read the file, check against rules in priority order, report findings as:
file:line — [rule] description of issue© jezweb, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in plugins/frontend/skills/react-patterns of jezweb/claude-skills.
Open the folder on GitHubat commit 64965d9
Compare with similar skills
React Patterns next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| React Patterns this skilljezweb/claude-skills | 1.1k | — | ~2.3k | Automated safety check: Pass | MIT | |
| Web Artifacts Builderanthropics/skills | 180k | 41 repos | ~769 | Automated safety check: Pass | Apache-2.0 | |
| React Router Developmentremix-run/react-router | 57k | 1 repos | ~1.5k | Automated safety check: Pass | MIT | |
| Chakra UI v3 Builderchakra-ui/chakra-ui | 41k | — | ~3.1k | Automated safety check: Pass | MIT | |
| Creative Tim UI Blockscreativetimofficial/ui | 12k | — | ~2.1k | Automated safety check: Notes | MIT | |
| South Admin CRUD Generatorsouthliu/south-admin-react | 580 | — | ~1.7k | Automated safety check: Pass | MIT |
Similar skills
- Official
React Router Development
remix-run/react-router
Guides work on React Router apps by first identifying whether the app uses Framework, Data or Declarative mode, then loading the matching reference and the installed package docs.
Chakra UI v3 Builder
chakra-ui/chakra-ui
Builds responsive, accessible Chakra UI v3 components and layouts, sets up Chakra in new or existing projects, and designs themes with tokens, semantic tokens and recipes.
Creative Tim UI Blocks
creativetimofficial/ui
Helps install, generate and review Creative Tim UI blocks: shadcn/ui-based React and Tailwind sections that follow a restrained, production-minded design philosophy.
South Admin CRUD Generator
southliu/south-admin-react
Generates a full CRUD page - page component, data model and API client - from the south-admin-react project's own VS Code snippet templates.
Shadmin Dev
ahaodev/shadmin
Apply Shadmin feature-development standards (backend Go/Gin/Ent + frontend React/TS).
More from jezweb/claude-skills
All 52 skills in this repoElevenlabs Agents
jezweb/claude-skills
Build conversational AI voice agents on the ElevenLabs platform.
Favicon Gen
jezweb/claude-skills
Generate custom favicons from logos, text, or brand colours.
Tailwind Theme Builder
jezweb/claude-skills
Set up Tailwind v4 + shadcn/ui themed UI with dark mode. An agent skill from jezweb/claude-skills.
Project Health
jezweb/claude-skills
All-in-one project configuration and health management. An agent skill from jezweb/claude-skills.
Responsiveness Check
jezweb/claude-skills
Test website responsiveness across viewport widths using browser automation.
MCP Builder
jezweb/claude-skills
Build MCP servers in Python with FastMCP. An agent skill from jezweb/claude-skills.
Related
Works with
Categories
Questions about React Patterns
What does React Patterns do?
React 19 performance patterns and composition architecture for Vite + Cloudflare projects. React Patterns is an agent skill from jezweb/claude-skills. React 19 performance patterns and composition architecture for Vite + Cloudflare projects.
When should I use React Patterns?
React Patterns fits situations like: refactoring React components; tasks that involve React components.
How do I install React Patterns in Claude Code?
Run `npx skills add jezweb/claude-skills --skill react-patterns -a claude-code`. Or copy the skill folder (plugins/frontend/skills/react-patterns in jezweb/claude-skills) into .claude/skills/react-patterns in your project. Claude Code loads it when a task matches its description.
How do I install React Patterns in Codex?
Run `npx skills add jezweb/claude-skills --skill react-patterns -a codex`. Or copy the skill folder (plugins/frontend/skills/react-patterns in jezweb/claude-skills) into .agents/skills/react-patterns in your project. Codex loads it when a task matches its description.
Can I use React Patterns in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add jezweb/claude-skills --skill react-patterns -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/react-patterns, .gemini/skills/react-patterns, .github/skills/react-patterns and .opencode/skills/react-patterns in your project.
What does React Patterns need to run?
Going by SKILL.md and its folder, React Patterns needs the command-line tools its instructions call (npx). Our summary lists: Node.js. Its frontmatter pre-approves these tools: Read, Glob, Grep. Compatibility (from SKILL.md): claude-code-only.
Does React Patterns access the network?
SKILL.md contains no URLs. Its commands use npx, which can reach the network depending on how they are called. This is read from the text; nothing was executed.
Is React Patterns safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does React Patterns use?
React Patterns is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does React Patterns use?
About 2.3k tokens (SKILL.md is roughly 9.4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to React Patterns?
Skills that share tags, products or a category with React Patterns: Web Artifacts Builder (anthropics/skills, 180k stars), React Router Development (remix-run/react-router, 57k stars), Chakra UI v3 Builder (chakra-ui/chakra-ui, 41k stars) and Creative Tim UI Blocks (creativetimofficial/ui, 12k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains React Patterns?
jezweb (a GitHub user) maintains it in jezweb/claude-skills, which has 1,051 GitHub stars. The repository holds 52 skills in this directory. The repository was last updated on October 5, 2026.
Source: jezweb/claude-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.