remotion-saas

Remotion を使ってアプリを構築する

remotion-saas とは?

このスキルは、Remotion を使用して動画生成機能を備えた SaaS アプリケーションを構築するための包括的なガイドを提供します。Remotion は React ベースの動画ライブラリであり、このスキルではシンプルなフォームをレンダリングに接続する方法から、複雑な動画エディタの構築までをカバーします。サポート対象プラットフォームとしては、Lambda、Vercel、Node.js、Cloudflare などのサーバーサイドレンダリングオプションだけでなく、<Player> コンポーネントを使ったクライアントサイドの埋め込みも含まれます。また、迅速な開発を可能にするための SaaS 向けテンプレートも提供されており、Vue、Angular、Svelte などの他のフレームワークで Remotion を使用するためのドキュメントへのリンクも含まれています。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/remotion-dev/skills/tree/main/skills/remotion-saas

Installed? Explore more ビデオ&アニメーション skills: steipete/video-frames, steipete/summarize, openclaw/openclaw · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

Remotion を使ってアプリを構築できます。 シンプルなフォームをレンダリングに接続したり、複雑な動画エディタを作成することも可能です。

テンプレートまたはフレームワークの選択

SaaS 向けのテンプレートがいくつか用意されており、クローンして使用したり参考にすることができます。 テンプレートやフレームワークの選択については、フレームワークの選択 を参照してください。

<Player> コンポーネント

このコンポーネントを使用すると、React アプリ内に Remotion のプレビューを埋め込むことができます。Player の詳細については、Player を参照してください。

レンダリング

クライアントサイドとサーバーサイドのレンダリングオプションが利用可能です。選択方法や Lambda、Vercel、Node.js、Cloudflare の各オプションについては、レンダリング を参照してください。

Vue での使用

Vue で Remotion を使用する方法については、https://www.remotion.dev/docs/vue.md を参照してください。

Angular

Angular で Remotion を使用する方法については、https://www.remotion.dev/docs/angular.md を参照してください。

Svelte

Svelte で Remotion を使用する方法については、https://www.remotion.dev/docs/svelte.md を参照してください。

Individual skills in this repo

This repo contains 19 individual skills — each has its own dedicated page.

関連スキル