# Remotion - 用React写视频

> 像写前端代码一样做视频，React组件驱动+批量渲染，程序员的自媒体利器

## Remotion - 用 React 编程式制作视频

用你熟悉的 React 组件来创建视频，让视频制作像写前端代码一样优雅。

## 核心特性

- **React 驱动**：用 JSX/TSX 编写视频，复用 React 生态（组件、Hooks、状态管理）
- **编程式控制**：每一帧都是一个 React 渲染，可以精确控制动画、布局、数据绑定
- **批量渲染**：通过参数化输入，批量生成成千上万个个性化视频
- **实时预览**：开发时实时预览视频效果，支持快进、逐帧调试
- **服务端渲染**：支持 Headless Chrome / AWS Lambda 渲染，集成到 CI/CD 流水线
- **AI 集成**：官方支持 AI 工作流，可结合 LLM 动态生成视频内容

## 技术栈

| 层级 | 技术 |
|------|------|
| 框架 | React / TypeScript |
| 渲染引擎 | Chrome (Puppeteer) |
| 包管理 | npm / yarn / pnpm |
| 云渲染 | Remotion Lambda (AWS) |
| 视频编码 | FFmpeg |

## 代码示例

```tsx
import {useCurrentFrame} from 'remotion';

export const MyVideo = () => {
  const frame = useCurrentFrame();
  const opacity = frame / 30;
  
  return (
    <div style={{opacity, fontSize: 80}}>
      Hello, Remotion!
    </div>
  );
};
```

## 使用场景

1. **短视频批量生成**：配合 AI 脚本，批量生产抖音/小红书视频内容
2. **数据可视化视频**：动态图表、数据报告视频化
3. **个性化营销视频**：根据用户数据生成定制化推广视频
4. **产品演示动画**：自动化生成产品介绍、功能演示视频
5. **社交媒体自动化**：与 social-auto-upload 等工具联动，实现从视频生成到发布的全自动化

## 项目数据

| 指标 | 数据 |
|------|------|
| Stars | 48.2k+ |
| Forks | 3.4k+ |
| Commits | 33,000+ |
| 许可证 | Remotion License（个人/开源免费，企业需授权） |

## 安装

```bash
npx create-video@latest
```

## 注意事项

- Remotion License 对企业使用有特殊要求，年收入超过一定阈值需购买商业许可
- 渲染依赖 Chrome，服务器部署建议使用 Remotion Lambda
- 与 MoneyPrinterTurbo 互补：MPT 偏向全自动生成，Remotion 偏向精细化编程控制

---

**分类**：软件
**标签**：视频 · 生成 · Remotion
**作者**：Xiao.Xi
**链接**：https://octohz.com/p/1736