'components' 검색 결과

Modernize existing React applications through version upgrades and migration from class components to Hooks, functions for state and lifecycle behavior. Includes React 18 rendering APIs, grouped state updates, and features for prioritizing interface updates.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Plan an upgrade from React 16 through React 18
• Rewrite class components with Hooks
• Extract shared logic into custom Hooks

Build complex claude.ai artifacts with React, Tailwind CSS, and shadcn/ui. Create interfaces with multiple components, state management for changing data, and routing between views, then package the app into one self-contained HTML file for sharing.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Creating interfaces with multiple components
• Building artifacts with changing data and multiple views
• Sharing a React app as a single HTML file

Structure Avalonia interfaces with Zafiro.Avalonia using shared styles, reusable components, and purpose-built layout containers. Guides reductions in duplicated XAML, the interface markup, and deeply nested layouts, while covering themes, icons, and interaction behavior.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Consolidating repeated visual settings into shared styles
• Simplifying deeply nested screen layouts
• Extracting repeated layouts into reusable components

Migrate HeroUI v2 applications to v3 with guidance for component APIs, dependencies, styling, and hooks. Choose a full migration or move components gradually while both versions coexist, using migration documentation for each step.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Plan a full migration from HeroUI v2 to v3
• Migrate components gradually while keeping the app functional
• Update component APIs and event handlers

Write, review, or refactor React code using prioritized guidance for data fetching, bundle size, rendering, component structure, testing, and type safety. Start with high-impact issues such as sequential requests and unnecessary library loading.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Writing React components and data-fetching logic
• Reviewing code for loading and rendering performance
• Refactoring large components and overly broad interfaces

Create, edit, and reorganize Mastra documentation with guidance matched to the page type. Find the relevant rules for writing, links, navigation, shared components, diagrams, and redirects when reviewing pages or changing their structure.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Write or revise Mastra documentation pages
• Review sidebars and page organization
• Check redirects when moving or deleting pages

Build and render Table v9 tables in Vue with guidance on keeping data updates reactive, reusing shared table components, and connecting TanStack Query for data fetching or TanStack Virtual for displaying large tables.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Building a Table v9 table in Vue
• Keeping tables in sync with changing data
• Reusing shared table components and settings

Create and render Table v9 tables in Solid while preserving reactive data updates. Get guidance on reusable components, Query data integration, and virtualization, which renders only part of a table at a time.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build a basic table in Solid
• Keep table data reactive
• Reuse table settings and components

Create and render Table v9 tables in Preact, including headers and cells. Get guidance on reusable components, Query data integration, and virtualization, which renders only part of a table at a time.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build a basic table in Preact
• Reuse table features and components
• Connect server data through TanStack Query

Create and render Table v9 tables in Svelte 5. Covers basic setup and directs work on reusable components, TanStack Query data integration, and TanStack Virtual rendering, which limits displayed rows or columns for large tables.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build a basic Table v9 table in Svelte 5
• Organize reusable table components
• Connect tables to TanStack Query data

Build Table v9 tables in Angular using injectTable and FlexRender. Guidance covers signal-driven data updates, reusable table components, and connections to TanStack Query for data fetching and TanStack Virtual for displaying large tables.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Building a Table v9 table in Angular
• Reflecting signal-driven data changes in tables
• Sharing table settings and reusable UI components

Create and render TanStack Table v9 tables in octane. The skill covers project configuration, column definitions, and rendering headers, rows, and cells, with guidance for sharing table features and reusable interface components.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build a basic table in octane
• Render table headers, rows, and cells
• Configure Vite and TSRX for the adapter

Build and render tables with React Table v9, with guidance on stable data and column definitions. Find task-specific references for reusable components, Query data fetching, and virtualization, which limits rendering to visible rows or columns.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Building a basic React table
• Organizing reusable table components
• Connecting tables to Query data

Turn Figma screens and components into application code using design specifications, screenshots, and supplied assets. Reuse existing project components and shared style values, then check layout, typography, responsive behavior, and accessibility against the design.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Implement a button from a Figma component
• Build a dashboard from a Figma frame
• Integrate designs with an existing component library

Build and review JetBrains plugin interfaces using Swing and IntelliJ Platform components. Follow concrete rules for layouts, theme colors, fonts, spacing, dialogs, and tool windows while keeping shared style values consistent.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Building tool windows and settings screens
• Reviewing theme colors, fonts, and spacing
• Choosing components for dialogs and notifications

Build React interfaces for Kortix using @kortix/ui components. The skill covers forms, dialogs, notifications, and chat views, with shared styling rules, brand customization through CSS variables, and checks for types, controls, and responsive layouts.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Building forms and dialogs with existing components
• Adding a chat view with SessionThread
• Adapting component colors and logos to another brand

Create HTML or plain-text emails from JSON specifications with React Email. This skill guides reusable email components, conditional content, server-side rendering, and browser previews for transactional messages such as signup notifications and marketing emails.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Create signup notifications and other transactional emails
• Build marketing emails from JSON specifications
• Vary email content using state and conditions

Turn JSON specifications into React interfaces using a catalog of available components. This skill helps connect component implementations, shared data, form inputs, conditional display, and user actions to render interactive screens, including AI-generated designs.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Render AI-generated JSON as a React interface
• Define a catalog of reusable UI components
• Connect form inputs to shared data

Understand a public GitHub repository through GitDiagram's architecture overview. Get an explanation of its main components, source paths, and connections, plus Mermaid diagram source and an interactive diagram for exploring the code.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Getting an overview of an unfamiliar public repository
• Finding source paths for major components
• Understanding connections and data flow

Design reusable Figma components, flexible layouts, and shared design systems. Get guidance on managing colors and spacing, supporting themes and screen sizes, and preparing clear specifications and assets for developers.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Organizing reusable components and their variants
• Building layouts that adapt to different screen widths
• Managing shared colors, spacing, and light or dark themes

Add GSAP animations to Vue, Nuxt, Svelte, and SvelteKit components with guidance on when animations should start, which elements they affect, and how to remove animations and restore styles when components are removed.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Adding animations to Vue components
• Reviewing animation cleanup in Svelte
• Limiting animations to elements within a component

Organize React and TypeScript frontend code using consistent rules for feature folders, shared components, types, API access, and tests. Use it to guide new code, focused refactoring, and reviews of existing changes.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Adding a frontend feature with consistent file organization
• Reviewing shared components and type placement
• Refactoring imports and module exports

Build, test, and format CubeSandbox components using make targets and a Docker builder. Also covers the web dashboard’s development workflow, API type synchronization, and troubleshooting for missing services, outdated build tools, and environment requirements.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build all components or a specific CubeSandbox component
• Run component tests or a single targeted test
• Format Go and Rust code and lint the web interface

Build Vue 3 applications using JavaScript and JSDoc comments that describe data types. Create components and reusable logic, configure Vite, routing, and state management, and check annotations and behavior with ESLint and Vitest.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Build Vue 3 interfaces using JavaScript
• Add JSDoc type hints to components and shared logic
• Migrate Vue 2 Options API code to Composition API