claude

frontend-react

Frontend React skills — component structure, hooks registry, skeleton components, Storybook stories.

2 on GitHubby Roman Maslennikovv2.0.4updated 3 days ago
/

Plugin frontend-react from marketplace bladeforge in aquivalabs/BladeForge. Commands read from the repo's manifest — 2 days ago.

What it installs

Skills (8)

  • component-placement

    Entry point BEFORE creating ANY React component, in any React codebase — search for an existing one first, decide placement (primitive / feature / layout / page-local), then route to the matching per-type skill. Framework-agnostic: governs component ARCHITECTURE, not any specific UI or styling libra

  • component-structure

    Use when creating, editing, restructuring, or reviewing a React frontend component \u2014 including its folder layout and file organization (tsx/scss/index), where a component or sub-component should live, BEM class naming, SCSS styling, rem sizing, i18n of user-visible strings, barrel exports, and

  • feature-components

    Rules for FEATURE components in a React codebase — domain-coupled blocks that compose primitives and hold business logic/data. Activate when building or editing a domain feature (a panel/table/editor tied to your business data), or adding a new domain area. Framework-agnostic. Reached via frontend-r

  • hooks-registry

    Use when about to add, hand-roll, rename, move, or remove a custom React `use*` hook.

  • layout-components

    Rules for LAYOUT / app-chrome components in a React codebase — the shell, top bar, sidebar, command palette, and global overlays that frame every page. Activate when editing or adding app chrome. Framework-agnostic. Reached via frontend-react:component-placement.

  • skeleton-components

    When building or editing a React component that renders asynchronously-loaded data, decide whether it needs a loading skeleton — and if so, build a separate skeleton component colocated next to it from the shared Skeleton primitive. Activate whenever a component gains a loading state, shows a blank/

  • storybook-stories

    Use this skill whenever writing, adding, or asking about a Storybook story for a React/UI component \u2014 including \"add a story for X\", \"write a .stories file\", questions about which states/variants a story should cover (default, empty, error, loading, disabled), how to show a component's skel

  • ui-primitive-reuse

    Before creating ANY shared/reusable UI primitive in a React codebase (button, input, checkbox, radio, switch, select, textarea, dialog, tooltip, dropdown, badge, card, separator…), search the project's primitive library first to avoid duplicates — reuse or extend what exists; build new only when tru

View source on GitHub

More from aquivalabs/BladeForge

All 25 plugins →

review

claude

Stack-agnostic pre-push review framework — eight reviewer agents (five on by default, plus skill, leak and security-scan for repos that publish skills), the /review orchestrator, and the secret-scan + attestation gate, all driven by a per-project .claude/review.config.json.

2 skills · 2 commands · 8 agents

2

meta

claude

Meta skills — authoring new skills, the OCKHAM minimal-entities discipline, and the WITTGENSTEIN clarity gate for specs & plans.

10 skills

2

Frontend Vue 3 skills — single-file components with Composition API and TypeScript, component architecture, BEM in scoped styles, Pinia stores, VueUse-first composables, Nuxt conventions, motion, testing.

9 skills

2

Personal Salesforce skills — Apex test authoring standard and salesforce-dx MCP usage.

5 skills

2

Whose Turn, the Claude Code side of a local monitor of your Jira, GitHub, Linear and other sources: whose turn it is, what changed, your own to-dos, a summary at the start of each session, a hand-off from the monitor window into the session, a /whose-turn command that opens the window, and an MCP server for any agent. The monitor itself is the published whose-turn npm package; the plugin installs its latest version into the monitor's data directory on first start and runs it from there; each newer version is then announced in its window and at session start and installs only when the user says yes or clicks Update. Employer-specific values live in a workspace config on the machine, not in the plugin.

1 skill · 1 command · 1 MCP server · hooks

2

cerberus

claude

CERBERUS — the two-headed guard at the gate for a PUBLIC skills marketplace. A PostToolUse hook fires on every skill / reference / script / eval / manifest edit and reminds you to run BOTH heads before committing: cerberus:leak-check (outward — no real work identifier or secret escapes into the public marketplace) and cerberus:security-scan (inward — the eight-point consumer-safety checklist: prompt injection, exfiltration, secrets, dangerous commands, obfuscation, external fetches, credential access, privilege escalation, so nothing unsafe reaches whoever installs the skill). Before a push it also guards the commits themselves — their messages, authors and branch name, which no file check reads: a classic PreToolUse hook has a nested claude judge the outgoing commits and blocks a push that leaks or that it cannot judge, and on Claude Code 2.1.292 or newer a push-guard mod judges them in-process first; an older Claude Code gets a red notice at session start to update. The verdict cache is guarded best-effort, so the hook stops a forgotten check, not a deliberate forgery. Both are agent judgment passes, no denylist by design — a list of the real names to catch would itself be the leak; the intelligence lives in the agent, not a regex.

2 skills · hooks

2

Similar plugins

ecc

claudecodex

Harness-native ECC operator layer - 71 agents, 314 skills, 98 legacy command shims, reusable hooks, rules, selective install profiles, and production-ready workflows for Claude Code, Codex, OpenCode, Cursor, and related agent harnesses

200 skills · 98 commands · 71 agents · 1 MCP server · hooks

affaan-m/ECC 302,088

Comprehensive toolkit for developing Claude Code plugins. Includes 7 expert skills covering hooks, MCP integration, commands, agents, and best practices. AI-assisted plugin creation and validation.

7 skills · 1 command · 3 agents

anthropics/claude-code 155,476

Professional UI/UX design intelligence for AI coding assistants. Includes searchable databases of styles, colors, typography, charts, and UX guidelines for React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, and Three.js.

7 skills

nextlevelbuilder/ui-ux-pro-max-skill 148,759

nextjs

claude

Official Next.js skills: adopt and optimize Cache Components, adopt Partial Prefetching, and verify runtime behavior against a running dev server.

6 skills

vercel/next.js 143,495

CMEM Pro

claude

CMEM Pro for the Claude app - hooks stream tool use to cmem.ai and inject observations into new sessions and agents

3 skills · 1 MCP server · hooks

thedotmack/claude-mem 116,618

storybook

claudecodex

Build, preview, and test UI components with Storybook.

7 skills

storybookjs/storybook 91,552

Maintain frontend-react?

This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.

claude & codex plugins25 plugins