Communitygithub.com

riaz37/remotion-ui

RemotionUI 모노레포 작업 — 레지스트리 작성, CLI 명령어, remotion-ui.json 설정, 복사-붙여넣기 컴포넌트 배포를 지원합니다. 프리미티브/씬/컴포지션을 추가하거나 remotion-ui CLI를 실행할 때 사용하세요.

remotion-ui란 무엇인가요?

이 스킬은 RemotionUI 모노레포에서 작업할 때 사용됩니다. RemotionUI는 Remotion 비디오 컴포넌트를 복사-붙여넣기 방식으로 배포하는 도구로, 컴포넌트를 npm 패키지로 발행하는 대신 사용자가 소스 파일을 프로젝트에 직접 복사하여 사용합니다. 이 스킬은 레지스트리 컴포넌트 작성, `remotion-ui` CLI 사용, `remotion-ui.json` 설정 파일 작업, 그리고 `Root.tsx`나 `remotion.config.ts` 파일 패치와 같은 설치 과정을 안내합니다. 주요 경로로 레지스트리 소스(`apps/web/registry/`), 레지스트리 매니페스트(`apps/web/registry.json`), CLI 패키지(`packages/remotion-ui/`)가 포함되며, `pnpm skills:sync`, `pnpm registry:build` 등의 명령어를 제공합니다. 또한 Remotion 모범 사례 문서를 순서대로 참조하여 올바른 비디오 레이아웃을 유지하도록 돕습니다.

지원 대상✓Claude Code✓Codex CLI~Cursor
npx skills add https://github.com/riaz37/remotion-ui/tree/HEAD/skills/remotion-ui

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

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

문서

RemotionUI

RemotionUI 모노레포에서 작업하거나 사용자가 Remotion 비디오 컴포넌트를 추가할 수 있도록 도울 때 이 스킬을 사용하세요.

Remotion 프레임워크 모범 사례는 다음 순서로 읽으세요:

  1. skills/remotion/docs/INDEX.md — 공식 remotion.dev 문서 미러 (pnpm docs:remotion으로 새로고침)
  2. skills/remotion/remotion-best-practices/SKILL.md — Remotion 스킬 + 규칙
  3. skills/remotion/remotion-create/video-layout.md — 레이아웃 겹침 방지

사용 시기

  • 레지스트리 컴포넌트 추가 또는 작성
  • remotion-ui CLI 작업
  • 복사-붙여넣기 배포 모델 이해
  • 설치 중 Root.tsx 또는 remotion.config.ts 패치

주요 경로

  • 레지스트리 소스: apps/web/registry/
  • 레지스트리 매니페스트: apps/web/registry.json
  • 빌드된 레지스트리: apps/web/public/r/
  • CLI 패키지: packages/remotion-ui/
  • 사용자 설정: remotion-ui.json

명령어

pnpm skills:sync             # Remotion 스킬 동기화 + Codex 연결
pnpm registry:build          # 레지스트리 JSON 빌드
pnpm dev                     # 문서 사이트 시작
pnpm build                   # 모든 패키지 빌드

참조 문서

철학

컴포넌트는 npm 패키지로 발행되지 않습니다. CLI(remotion-ui)만 발행됩니다. 사용자는 소스 파일을 자신의 프로젝트에 복사하여 사용합니다.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

관련 스킬