Generate modern React components, custom hooks, and Tailwind styles with TypeScript; implement patterns like composition and state management with Zustand; design app architectures; write Vitest and Jest tests; review code for best practices, performance, accessibility, and quality using specialized agents.
npx claudepluginhub majesticlabs-dev/majestic-marketplace --plugin majestic-react```tsx
Design React application architecture and component hierarchies. Plans state management, folder structure, and performance optimization strategies.
```tsx
Review React components for best practices, performance, accessibility, and testing coverage. Invoke after implementing features, modifying existing code, or creating new React components.
```tsx
Write modern React components with TypeScript, hooks, and best practices. Creates functional components, custom hooks, and follows composition patterns.
Expert guidance on modern React patterns including hooks, composition, state management, and concurrent features. Use when implementing React components or refactoring existing code.
Testing patterns for Vitest, React Testing Library, and Jest. Routes to component, hook, and integration test examples.
Generate responsive, performant Tailwind CSS styles for React components. Use when styling components, building design systems, or implementing responsive layouts.
Uses power tools
Uses Bash, Write, or Edit tools
Share bugs, ideas, or general feedback.
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claimBuild React components with TypeScript. Covers type-safe patterns for React 18-19 including generic components, proper event typing, and routing integration.
Skills + Subagents for React/TypeScript - Use skills for coding guidance, or run recipe workflows for full orchestrated agentic coding with specialized agents
AI-powered generative UI with Thesys - create React components from natural language.
Modern React and UI development expertise. Master React 19, Next.js 15, component architecture, state management, performance optimization, and design systems.
Use this agent for expert assistance with web development tasks using React, Next.js, NestJS, and other modern web frameworks with TypeScript and Tailwind CSS. This includes code analysis, component creation, debugging, performance optimization, and architectural decisions. Examples: <example>Context: User is building a Next.js app and encounters a routing issue. user: 'My dynamic routes in Next.js are not rendering correctly' assistant: 'Let me use the web-dev agent to analyze your Next.js routing setup and provide a solution' <commentary>This is a Next.js-specific routing issue, so the web-dev agent will provide targeted guidance.</commentary></example> <example>Context: User needs a reusable React component with Tailwind CSS. user: 'I need a card component that matches my app's Tailwind-based design system' assistant: 'I'll use the web-dev agent to create a TypeScript-based React card component styled with Tailwind CSS, following your app's design patterns' <commentary>The user requires a component that aligns with their Tailwind CSS design system, so the web-dev agent ensures compatibility.</commentary></example>
React development standards and best practices for agent-driven code generation. Guides AI agents in writing performant, maintainable React code.
The Majestic marketplace where we share our workflows.
New here? Check out the Marketplace Tutorial for an interactive walkthrough.
Coding is no longer the bottleneck. Planning, review, and learning loops matter more than syntax. Each feature makes the next one easier to build.
| Step | What Happens | Key Tools |
|---|---|---|
| Plan | Agents research codebase + best practices, produce detailed implementation plans | /majestic:plan, architect agent |
| Work | Agents write code, tests, and iterate using real app feedback | /majestic:build-task, coder skills |
| Assess | Multi-angle review: security, performance, simplicity, conventions | /majestic:code-review, quality-gate |
| Reflect | Analyze session patterns, capture lessons so future agents improve | /majestic-tools:insight:reflect, /majestic:add-lesson |
See the Workflow Guide for detailed documentation.
Run the installer:
curl -fsSL https://raw.githubusercontent.com/majesticlabs-dev/majestic-marketplace/master/install.sh | bash
This gives you options to:
Run claude and add the marketplace:
/plugin marketplace add https://github.com/majesticlabs-dev/majestic-marketplace.git
Then install a plugin:
/plugin install {plugin-name}
Export Majestic plugins to OpenCode or Codex with schema-aware conversion:
./scripts/install-codex.sh
# Install all plugins
./scripts/install-codex.sh --all
# Install all plugins to OpenCode
./scripts/install-opencode.sh --all
# Install specific plugins
./scripts/install-codex.sh engineer rails tools
# Example (explicit): convert engineer, rails, and tools to OpenCode
# Output target: ~/.config/opencode
./scripts/install-opencode.sh engineer rails tools
# Install one plugin (short or prefixed)
./scripts/install-codex.sh engineer
./scripts/install-codex.sh majestic-tools
Both commands are now local to this repository and only require Ruby (scripts/convert-plugin.rb).
This runs a converter pipeline (not a plain file copy), so incompatible Claude metadata is translated for target formats.
disable-model-invocation frontmatter is preserved as part of source metadata parsing, but it does not exclude a command from conversion for OpenCode/Codex output.
Output locations:
~/.codex/skills/ and ~/.codex/prompts/~/.config/opencode (opencode.json, agents/, skills/, plugins/)Limitations: Codex still does not support some Claude Code features (Task, hooks, some MCP integrations), so behavior is reduced there.
| Plugin | Description |
|---|---|
| majestic-engineer | Language-agnostic engineering workflows (17 agents, 8 commands, 12 skills) |
| majestic-rails | Ruby on Rails development tools (23 agents, 5 commands, 9 skills) |
| majestic-react | Modern React development with TypeScript (3 agents, 1 command, 4 skills) |
| majestic-python | Python development tools (2 agents) |
| majestic-devops | Infrastructure-as-Code and DevOps workflows (1 agent, 8 skills) |
| majestic-llm | External LLM integration - Codex, Gemini (5 agents, 1 command) |
| majestic-marketing | Marketing and SEO tools (14 agents, 2 commands, 24 skills) |
| majestic-sales | Sales acceleration tools (1 command, 6 skills) |
| majestic-company | Business operations and CEO tools (2 agents, 21 skills) |
| majestic-experts | Expert panel discussion system (2 agents, 1 command) |
| majestic-tools | Claude Code customization tools (10 commands, 3 skills) |