This is a Remix starter kit with Remotion, @remotion/player
and @remotion/lambda
built in.
It lets you render a video from a Remix app with AWS Lambda.
Here is the output video:
logo-animation.mp4
Install dependencies using
npm install
Run the example app using:
npm run dev
Start the Remotion Preview (the editor interface) using:
npm run remotion:studio
Follow these steps to set up video rendering:
-
Follow the steps in Remotion Lambda setup guide.
-
Rename the
.env.example
file to.env
. -
Fill in the
REMOTION_AWS_REGION
with the region that you would like to use, e.g.us-east-1
. -
Fill in the
REMOTION_AWS_ACCESS_KEY_ID
andREMOTION_AWS_SECRET_ACCESS_KEY
values that you got from the first step. -
Run the following to deploy your Lambda function and Remotion site:
npm run remotion:deploy
Rerun this command whenever you have upgraded to a new Remotion version.
- Restart the Remix server.
Start the app in development mode:
npm run dev
Build the app for production:
npm run build
Start the app in production mode (after build is done):
npm run dev
Start the Remotion preview:
npm run remotion:preview
Render the example video locally:
npx remotion render
Upgrade all Remotion packages:
npx remotion upgrade
Render the example video on AWS Lambda:
npm run remotion:renderlambda
Deploy/Update the Remotion video on S3 and the Lambda function:
npm run remotion:deploy
When upgrading Remotion to a newer version, you will need to redeploy your function and update your site using the commands above.
If your functions or sites are already used in production, make sure to not overwrite them - read here for more details about upgrading.
Get started with Remotion by reading the fundamentals page.
See the Remix Docs to read about the framework.
Join the Remotion Discord server to chat with other Remotion builders.
Found an issue with Remotion? File an issue here.
Note that for some entities a Remotion company license is needed. Read the terms here.