REMPTIONで動画のサンプルを動かすよ

  • 2023年4月29日
  • 2023年4月29日
  • IT
  • 28view
IT

実行環境
Windows10
nodejs
vscode
remotion

REMOTIONをインストール。なんとオープンソース製品です。
remotion
公式サイト https://www.remotion.dev/
ドキュメント Docs: https://remotion.dev
リポジトリ Github: https://github.com/JonnyBurger/remotion

実行の準備としてリポジトリをFORKして、Windows10のvscordでCloneします。

Installation

>cd ..
>npm init video
>cd my-video
> npm start
my-video@1.0.0 start
remotion preview
Server ready – Local: http://localhost:3000, Network: http://192.168.11.5:3000
Built in 2430ms

http://localhost:3000

http://192.168.11.5:3000

LANでつながっているiphoneでアクセス。

止めるときはCTR+Cとyキーです

作成した動画はmp4ファイルに保存することができる

ほかも全て動かしてみる

my-video1. Hello World A “Hello World” starter template
my-video2. Blank Nothing except an empty canvas
my-video3. Hello World (JavaScript) The default starter template in plain JS
my-video4. Remix Remotion + Remix Starter Kit
my-video5. React Three Fiber Remotion + React Three Fiber Starter Template
my-video6. Still images Dynamic PNG/JPEG template with built-in server
my-video7. Text To Speech Turns text into speech and makes a video
my-video8. Audiogram Text and waveform visualization for podcasts
my-video9. Skia React Native Skia starter
my-video0. Tailwind TypeScript and Tailwind starter
my-video1. Overlay Overlays for video editing software

video3

サーバーが起動するので、ローカル(パソコンのブラウザ)で動く!ローカルIPでも動く!mp4ファイルに書き出すこともできる!

v3.3.86は4日前にアップデートされてます。サンプルコードの中にはサーバーが起動しないものと、サーバーが起動しても動画が再生されないものもあった。私の実行環境に問題がありそう。

最新情報をチェックしよう!
>最強の情報発信ツールWordPress

最強の情報発信ツールWordPress

御社がインターネットで影響力を武器にしようと思ったら使うべきツールはWordPress一択です。

CTR IMG