// 미디어 파일 업로드 및 관리
const mediaManager = new MediaFileManager();
const mediaFile = await mediaManager.uploadFile(file);

// 타임라인 및 편집 작업 관리
const timeline = new TimelineManager(30); // 30fps
const track = timeline.createTrack('Video Track', 'video');
timeline.addItemToTrack(trackId, mediaItem);

// MCP 서버 인터페이스
const server = new MCPVideoEditingServer();
const sessionId = server.createSession();
const response = await server.handleRequest(mcpRequest);

npm install

npm run dev

npm run build

// 1. MCP 클라이언트 초기화
const client = new MCPClient('http://localhost:3000/mcp');
await client.startSession();

// 2. 미디어 파일 업로드
const mediaFile = await client.uploadMedia(fileData, 'video.mp4', 'video/mp4');

// 3. 트랙 생성 및 미디어 추가
const track = await client.createTrack('Main Video', 'video');
const mediaItem = await client.addToTimeline(track.id, mediaFile.id, 0);

// 4. 편집 작업
await client.trimItem(track.id, mediaItem.id, 30, 180); // 30-180프레임 구간만 사용

// 5. 내보내기
const exportId = await client.exportVideo('mp4', 'high');

// 키프레임 애니메이션
const keyframeManager = new KeyframeManager();
keyframeManager.addKeyframe(itemId, {
  frame: 0,
  property: 'opacity',
  value: 0,
  easing: 'ease-in'
});
keyframeManager.addKeyframe(itemId, {
  frame: 30,
  property: 'opacity',
  value: 1,
  easing: 'ease-in'
});

// 현재 프레임에서 값 계산
const currentOpacity = keyframeManager.getValue(itemId, 15, 'opacity'); // 0.5

<MyComposition 
  mediaItems={mediaItems}
  timelineControls={timelineControls}
/>

<EditorDemo 
  width={1280}
  height={720}
  fps={30}
/>

src/
├── Composition.tsx          # 메인 비디오 컴포지션
├── Root.tsx                 # Remotion 루트 컴포넌트
├── utils/
│   ├── mediaUtils.ts        # 미디어 파일 관리 유틸리티
│   └── timelineUtils.ts     # 타임라인 편집 유틸리티
├── api/
│   └── mcpInterface.ts      # MCP 서버 인터페이스
└── demo/
    └── EditorDemo.tsx       # 편집 데모 컴포넌트