'components' 검색 결과

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

Build working web pages, components, and application interfaces with a clear visual direction. The skill guides typography, color, spacing, motion, and responsive layouts that adapt to different screen sizes.

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

• Build a web page with a distinctive visual style
• Create reusable interface components
• Adapt an application interface for mobile screens

Build React and TypeScript pages with guidance for data fetching, loading states, styling, and navigation. Organize code by feature and apply lazy loading, which loads components when needed, using patterns for MUI v7 and TanStack Router/Query.

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

• Creating a React page or component
• Organizing frontend files by feature
• Coordinating data fetching and loading states

Build reusable Convex backend components with their own database tables and a small API, the functions an app calls. It guides component structure, app integration, authentication boundaries, and checks for generated code and type errors.

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

• Adding a local component to an existing Convex app
• Extracting reusable backend logic
• Building an integration with its own tables

Find, install, and customize shadcn/ui components for React applications. The skill guides project setup, theme changes, forms, dialogs, and dashboard layouts, with checks for keyboard access, screen reader support, and responsive behavior.

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

• Add UI components to an existing React project
• Customize themes and component variants
• Build forms and dashboard layouts

Turn a Figma file or design image into a working interface using the project's existing components and design tokens, its shared visual settings. Compare the implementation with the design and report differences, missing states, and parts awaiting backend connections.

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

• Implement an interface from a Figma design
• Build a screen from a supplied design image
• Reuse existing components and shared visual settings

Build web pages and interface components with a clear visual direction suited to their purpose and audience. The skill guides typography, color, layout, and animation, turning design choices into working frontend code.

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

• Building a landing page with a distinctive visual style
• Designing a dashboard with a consistent look
• Refining the typography, spacing, and colors of an existing web UI

Find and install reusable HyperFrames blocks and effect components, then integrate them into an existing composition. Configure block timing and layer order, merge component HTML, CSS, and JavaScript, and adjust installation paths.

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

• Find reusable blocks and components in the registry
• Add an installed block to an existing composition
• Merge effect snippets into HTML, CSS, and JavaScript

Inspect and edit Figma files through JavaScript using the Plugin API. Guides changes to text, layout, variables, and components, with incremental steps and visual checks to verify the resulting design.

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

• Inspect pages, components, and variables in a Figma file
• Update text and colors across matching elements
• Adjust auto-layout containers and child sizing

Build or update Figma pages, dialogs, and panels from code or descriptions. The workflow reuses design system components, shared colors, spacing, and text styles, producing assembled views that remain linked to existing design resources.

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

• Recreate an application page in Figma
• Update an existing screen to match code
• Build a dialog using shared components

Build or update a Figma design system from existing code. Organize shared colors, spacing, and typography, create reusable components with states and theme bindings, document their use, and check differences between the implementation and Figma.

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

• Building a Figma component library from existing code
• Organizing shared settings for light and dark themes
• Creating a button with variants and variable bindings

Build reusable maps, charts, rankings, diagrams, and opening or ending components for iPolloWork Video. Connect them to shared editing forms, project themes, structured data, AI editing areas, and animation timelines that support jumping to specific playback positions.

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

• Build reusable map, chart, or ranking components
• Connect component settings to shared forms and tables
• Make visuals follow the project theme

Turn a Figma design into code that fits an existing project. Reuse its components and shared style values, follow designer notes and component mappings, and adapt Figma's reference output to the project's framework and conventions.

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

• Implementing a screen from a Figma design
• Reusing existing project components in a design implementation
• Applying designer notes and shared style values

Use JavaScript through Figma's Plugin API to inspect file structure and edit design elements, components, variables, and layouts. Follow incremental steps with font loading, returned element IDs, and visual checks to validate changes.

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

• Edit shapes and text in a Figma file
• Set up components, variants, and shared design values
• Adjust auto-layout, fills, and variable bindings

Build or update a Figma design system to match a codebase. Organize reusable design values, light and dark themes, component variants, and documentation, then check component structure, appearance, and bindings to those values.

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

• Build a Figma component library from existing code
• Set up shared design values and light and dark themes
• Create components with variants and variable bindings

Find business logic repeated across software components, such as notifications, auditing, and validation. Compare responsibilities and dependencies, then recommend a shared service, shared library, or component merger with a prioritized consolidation plan.

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

• Finding duplicate business logic before refactoring
• Reviewing whether notification components should be merged
• Identifying candidates for shared services or libraries

Build working web pages, components, and app interfaces around a clear visual concept. Coordinate typography, color, spacing, motion, and interaction details, adapting layouts to different screen sizes while avoiding repetitive visual templates.

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

• Building a landing page with a distinct visual direction
• Creating a dark-themed analytics dashboard
• Implementing responsive web components

Implement and review browser API requests in OpenBot using shared patterns for reading and changing data. Covers cache keys, refreshing stored results after changes, error handling, and how components display request states.

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

• Adding a screen that displays server data
• Implementing create, update, and delete actions
• Investigating stale lists after an update

Implement, debug, or review Nexent frontend pages and React components using existing architecture and UI guidance. Cover API connections, shared data and types, styling, and localization, with checks for loading states, errors, and affected behavior.

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

• Implementing or fixing Nexent screens
• Reviewing React components and hooks
• Checking API connections and shared types

Build documentation sites from Markdown with VitePress, then configure navigation, search, and themes. The skill also covers embedding Vue components, organizing multilingual content, and preparing deployment settings for supported hosting platforms.

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

• Build a documentation site from Markdown
• Customize navigation, search, and themes
• Embed Vue components in documentation

Build soft, clay-like interface components using rounded corners and layered shadows. Includes CSS variables and examples for cards, buttons, inputs, and toggles, with guidance for dark mode, readable text contrast, and visible keyboard focus.

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

• Designing soft, dimensional cards and buttons
• Giving inputs and toggles a consistent appearance
• Adapting clay-like components for dark mode