資源列表
精選的 Remotion 學習資源、教學文章、社群連結與實用工具匯整。
資源列表
本頁整理了學習和使用 Remotion 的精選資源,包含官方文件、社群教學、實用工具與範例專案。
官方資源
文件與 API 參考
- Remotion 官方文件 — 最完整的 API 參考與使用指南。
- Remotion 更新日誌 — 追蹤每個版本的新功能與破壞性變更。
- Remotion GitHub 儲存庫 — 原始碼、Issue 追蹤與 Pull Request。
官方範例
- Remotion Templates — 官方提供的多種起始範本,涵蓋不同使用場景。
- remotion-dev/examples — GitHub 上的範例程式碼集合。
- Remotion Lambda 入門 — 使用 AWS Lambda 進行雲端渲染的完整指南。
社群資源
討論與問答
- Remotion Discord 伺服器 — 最活躍的 Remotion 社群,可以在這裡提問、分享作品、與其他開發者交流。
- GitHub Discussions — 功能請求與長篇討論的好地方。
- Twitter / X — @remotion_dev — 官方帳號,發布新功能與社群精選。
問答平台
- Stack Overflow — [remotion] 標籤 — 技術問題的問答紀錄。
教學文章與課程
入門教學
- Build a Video with React — CSS-Tricks — 介紹用程式碼製作影片的概念。
- Getting Started with Remotion — Smashing Magazine — 深入的入門文章,適合有 React 基礎的開發者。
YouTube 影片教學
- Remotion 官方 YouTube 頻道 — 官方發布的功能介紹與教學影片。
- Theo — t3.gg — 多次介紹 Remotion 的科技 YouTuber,解說清楚易懂。
- Fireship — 知名開發者頻道,曾有 Remotion 相關介紹影片。
實用工具
輔助套件
| 套件名稱 | 功能 |
|---|---|
@remotion/google-fonts | 輕鬆載入 Google Fonts |
@remotion/media-utils | 讀取媒體元資料、音訊資料 |
@remotion/layout-utils | 文字測量等排版工具 |
@remotion/paths | SVG 路徑操作工具 |
@remotion/shapes | 生成幾何形狀的工具函式 |
@remotion/noise | Perlin/Simplex 雜訊生成 |
@remotion/motion-blur | 動態模糊效果 |
@remotion/rive | Rive 動畫整合 |
@remotion/lottie | Lottie 動畫整合 |
@remotion/three | React Three Fiber 整合 |
@remotion/skia | React Native Skia 整合 |
設計工具整合
- Remotion Figma Plugin — 在 Figma 設計稿與 Remotion 之間快速轉換。
- After Effects 轉換工具 — 將 After Effects 動畫匯入 Remotion 的輔助工具。
精選開源專案
模板與起始專案
- remotion-template-starterkit — 官方基礎起始模板。
- remotion-template-next — 整合 Next.js 的模板。
- remotion-template-audiogram — 音訊波形影片生成模板。
社群打造的工具
- Remotion Shaders — GLSL Shader 在 Remotion 中的整合範例。
使用案例與作品集
知名使用案例
- GitHub 年度報告 — 使用 Remotion 生成個人化 GitHub 年度回顧影片。
- Replay.io — 使用 Remotion 生成時間軸重播影片。
- Typeframes — 基於 Remotion 的影片生成 SaaS 服務。
部落格與技術文章
- Remotion 官方部落格 — 深度技術文章與案例分享。
- Dev.to — #remotion — 社群撰寫的 Remotion 文章。
- Medium — remotion — 更多社群技術文章。
取得協助
若你在使用 Remotion 時遇到問題,推薦的求助順序:
- 搜尋官方文件,確認 API 用法。
- 在 GitHub Issues 搜尋類似問題。
- 加入 Discord 社群提問,社群成員通常回應很快。
- 若確認是 Remotion 的 Bug,在 GitHub 開新 Issue 回報。
小結
Remotion 擁有活躍的社群和豐富的學習資源。無論你是剛入門的新手,還是正在打造生產級渲染服務的開發者,這些資源都能提供有用的幫助。最推薦的起點是官方文件和 Discord 社群。