home/categories/frontend
category focus

Frontend

UI frameworks, state management, and styling.

2566 مهارةall categories
sorting
stars
current ordering strategy
query
all entries
refine the visible subset
frontend
0

handling-tarrays

ReactUMG TArray/数组属性处理指南。在传递数组给 UE 组件、使用 GridPanel 的 ColumnFill/RowFill、或遇到"不能用 JS 数组"问题时激活。必须用 UE.NewArray() 创建原生数组,包含 BuiltinFloat/String/Int 等类型常量。

15195999826
15195999826
development
open
frontend
0

react-spring

Use when implementing Disney's 12 animation principles with React Spring's physics-based animations

dylantarre
dylantarre
development
open
frontend
0

frontend-accessibility

Implement accessible user interfaces with semantic HTML, keyboard navigation, sufficient color contrast, screen reader support, ARIA attributes, and proper focus management. Use this skill when creating or editing React components (.tsx, .jsx files), when implementing forms with labels and inputs, when building interactive elements (buttons, modals, menus, dialogs), when implementing keyboard navigation, when choosing colors and ensuring contrast ratios, when adding ARIA attributes, when testing with screen readers, when implementing focus states and focus management, or when creating heading structures and page landmarks.

DevanB
DevanB
development
open
frontend
0

angular-migration

Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.

HermeticOrmus
HermeticOrmus
development
open
frontend
0

styling-guidelines

Best practices for component CSS, design system consistency, and layout patterns. Use when authoring component styles.

pixu1980
pixu1980
development
open
frontend
0

testing-hooks

Teaches testing custom hooks in React 19 using renderHook from React Testing Library. Use when testing custom hooks or hook behavior.

djankies
djankies
development
open
frontend
0

angular

Angular 21 開發模式和最佳實踐

c24712003
c24712003
development
open
frontend
0

frontend-hook

커스텀 훅 개발 에이전트. React 커스텀 훅을 설계하고 구현합니다.

shaul1991
shaul1991
development
open
frontend
0

threejs-react-ui-specialist

Integrate Three.js with React/Next.js using React Three Fiber for subtle 3D UI elements. Use when users request 3D cards, 3D backgrounds, interactive 3D UI components, parallax effects, 3D hover animations, or need to add Three.js to React/Next.js applications. Focus on performance-optimized, UI-focused 3D elements, not heavy 3D scenes or games.

NaveedTechLab
NaveedTechLab
development
open
frontend
0

setup-shadcn

Set up Shadcn/UI based on Base UI headless components

yuheitomi
yuheitomi
development
open
frontend
0

dnd-kit-implementation

Guide for implementing sortable and droppable components using dnd-kit library. Use this skill when building React applications that require drag-and-drop functionality with both container reordering (useSortable) and item dropping (useDroppable) capabilities, such as Kanban boards, file management systems, or playlist editors.

atman-33
atman-33
development
open
frontend
0

refactorangular

Refactor Angular code to improve maintainability, readability, and adherence to best practices. Transforms large components, nested subscriptions, and outdated patterns into clean, modern Angular code. Applies signals, standalone components, OnPush change detection, proper RxJS patterns, and Angular Style Guide conventions. Identifies and fixes memory leaks, function calls in templates, fat components, and missing lazy loading.

SnakeO
SnakeO
development
open
frontend
0

create-component-with-popup

Shadow DOM 팝업을 가진 컴포넌트를 생성합니다. 컴포넌트가 직접 데이터를 fetch하고 팝업으로 표시합니다. 3D 씬, 독립 위젯 등에 사용합니다.

JSKIM-90
JSKIM-90
development
open
frontend
0

migrate-to-signals

Convert RxJS observables or decorator-based code to Angular signals. Use when refactoring to signals, converting @Input/@Output to signal functions, or replacing BehaviorSubject with signal().

alysson-souza
alysson-souza
development
open
frontend
0

html-form-design-expert

Optimiert HTML-Formulare optisch und strukturell, ohne Funktionen, Events oder IDs zu verändern. Konzentriert sich auf Layout, UX und Barrierefreiheit.

DerGueni
DerGueni
development
open
frontend
0

component-hierarchy

Guide component selection in ResRequest Vue projects. Ensures correct usage of ShadCN-Vue vs custom components, proper imports, and design system compliance. Activates when creating or modifying Vue components.

richardhowes
richardhowes
development
open
frontend
0

styling-ui

Enforces design system using Tailwind CSS v4 and shadcn/ui. Use for: all styling, theming, responsive design, animations. DO NOT use for: component logic (use developing-nextjs), data fetching (use managing-convex).

Simplereally
Simplereally
development
open
frontend
0

tailwindcss-borders

Border utilities Tailwind CSS v4.1. Border (border-width, border-color, border-style, border-radius, rounded-*), Outline (outline-*, outline-offset), Ring (ring-*, ring-offset), Divide (divide-*).

fusengine
fusengine
development
open
frontend
0

vue-component-setup

Rules for vue component setup. Use this when writing a new vue component or when reviewing an exisinging component.

select
select
development
open
frontend
0

typescript-patterns

TypeScript utility types and type-safe API design patterns. Use when designing type systems, creating utility types, or implementing type-safe patterns.

wlfmnstr
wlfmnstr
development
open
frontend
0

css-animations

Creates native CSS animations using keyframes, transitions, and modern animation properties. Use when building animations without JavaScript libraries, optimizing performance, or implementing micro-interactions.

mgd34msu
mgd34msu
development
open
frontend
0

micro-100-200ms

Use when building micro-interactions between 100-200ms - tooltips appearing, dropdown opens, small feedback animations that feel quick but perceptible

dylantarre
dylantarre
development
open
frontend
0

typescript-patterns

Advanced TypeScript patterns for type-safe applications. Use when implementing complex types, generics, utility types, discriminated unions, or type guards in TypeScript projects.

Naw3
Naw3
development
open
frontend
0

valtio

Manages state with Valtio using proxy-based reactivity, direct mutations, and automatic re-renders. Use when wanting mutable state syntax, fine-grained reactivity, or state management outside React components.

mgd34msu
mgd34msu
development
open
Previous
Page 100 / 107
Next