Np-Ur https://blog.hatena.ne.jp/Np-Ur/ Np-Urのデータ分析教室 https://www.randpy.tokyo/ remotion React youtu.be はじめに 環境構築 前提条件 プロジェクト作成 AI エージェント向けの skills が自動でダウンロード！ プロジェクト構成 Remotion の根本的な考え方 Root.tsx ＝ 動画の設定ファイル 各パラメータの役割 schema と defaultProps HelloWorld.tsx のコード構造を読み解く 構成要素：AbsoluteFill と Sequence AbsoluteFill：空間の制御（レイヤー） Sequence：時間の制御（タイミング） これらを組み合わせて1本の Composition を構成 Title.tsx を例に：React と … 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fwww.randpy.tokyo%2Fentry%2Fremotion-1-outline" title="React で動画を作れる Remotion を触ってみたので全体像をまとめる【Remotion 第1回】 - Np-Urのデータ分析教室" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/N/Np-Ur/20260212/20260212114119.png Hatena Blog https://hatena.blog 2026-02-12 12:00:00 rich https://www.randpy.tokyo/entry/remotion-1-outline 1.0 100%