Communitygithub.com

diegofisi/WordRush

React 프론트엔드 원칙: 수직 슬라이스, 컨테이너/프레젠테이션, HTTP, React Query, WebSocket 스토어 등 모든 전송 계층에 대한 어댑터; 리포지토리의 UI 키트와 데이터 계층은 references/project.md에 선언되어 있습니다. 컴포넌트, 페이지, 뷰, 훅, 저장소, 폼, 라우트, 기능 슬라이스, DTO, ViewModel, i18n 문자열, 테마 토큰 또는 Tailwind, MUI, shadcn, Zustand, React Query, react-hook-form, zod, react-router, socket 코드를 포함한 모든 React/TSX 작업 시 사용하십시오.

WordRush란 무엇인가요?

WordRush는 React 프론트엔드 개발을 위한 일관된 아키텍처 원칙과 패턴을 제공하는 AI 에이전트 스킬입니다. 이 스킬은 수직 슬라이스 아키텍처, 컨테이너/프레젠테이션 컴포넌트 분리, 그리고 HTTP, React Query, WebSocket과 같은 다양한 전송 계층에 대한 어댑터 패턴을 강조합니다. Claude Code, Cursor, Codex를 포함한 주요 AI 코딩 에이전트와 호환되며, 리포지토리의 UI 키트와 데이터 계층 설정은 `references/project.md` 파일에 선언되어 있습니다. 이 스킬은 컴포넌트, 페이지, 뷰, 훅, 저장소, 폼, 라우트, 기능 슬라이스, DTO, ViewModel, i18n 문자열, 테마 토큰 등 모든 React/TSX 작업에 사용됩니다. Tailwind CSS, Material UI (MUI), shadcn/ui, Zustand 상태 관리, React Query 데이터 페칭, react-hook-form 및 zod 폼 검증, react-router 라우팅, WebSocket 및 Socket.IO 통신 등 현대 React 생태계의 주요 라이브러리와 프레임워크를 지원합니다. WordRush의 핵심 가치는 일관된 개발자 경험(DX)과 유지보수성을 제공하는 데 있습니다. 수직 슬라이스 아키텍처를 통해 기능별로 코드를 구성하여 관심사 분리를 명확히 하고, 컨테이너/프레젠테이션 패턴으로 비즈니스 로직과 UI를 분리합니다. 모든 데이터 전송은 어댑터 패턴을 통해 추상화되어, 필요에 따라 HTTP, React Query, WebSocket 등을 유연하게 교체할 수 있습니다. 이 스킬을 사용하면 AI 에이전트가 리포지토리의 일관된 아키텍처 원칙을 자동으로 준수하며 코드를 작성하므로, 개발자는 비즈니스 로직과 기능 개발에 더 집중할 수 있습니다. 특히 새로운 기능 슬라이스나 컴포넌트를 추가할 때 이미 정의된 패턴과 규칙에 따라 생성되므로, 코드 품질과 일관성이 크게 향상됩니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/diegofisi/WordRush/tree/master/docs/research/skills/propuesta/skills/frontend

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

WordRush은(는) 무엇을 하나요?

React 프론트엔드 원칙: 수직 슬라이스, 컨테이너/프레젠테이션, HTTP, React Query, WebSocket 스토어 등 모든 전송 계층에 대한 어댑터; 리포지토리의 UI 키트와 데이터 계층은 references/project.md에 선언되어 있습니다. 컴포넌트, 페이지, 뷰, 훅, 저장소, 폼, 라우트, 기능 슬라이스, DTO, ViewModel, i18n 문자열, 테마 토큰 또는 Tailwind, MUI, shadcn, Zustand, React Query, react-hook-form, zod, react-router, socket 코드를 포함한 모든 React/TSX 작업 시 사용하십시오.

관련 스킬