Implement into React App for Customers to use

[MichaelVidStep]

We've been looking for a basic video trimmer to build for our customers. How would I implement this into our existing web app and allow our customers to trim and render out their video?

[JonnyBurger]

Hi Michael!

This could be an architecture that supports users to trim and concatenate their videos:

• Create a Remotion project, that takes multiple video sources and timing information through input props: https://www.remotion.dev/docs/parametrized-rendering
• Create a React App, that allows users to upload a video, and supply timing information. Or create a UI that allows to chop and move those videos using Drag and Drop.
• Use the @remotion/player to embed your Remotion project into your webapp, and pass the videos and timing information into the Player: https://www.remotion.dev/docs/player. You can parametrize the content using inputProps: https://www.remotion.dev/docs/player/api#inputprops. Also see how you can merge your Remotion and React projects to just use 1 codebase: https://www.remotion.dev/docs/player/integration
• For rendering, you need to set up server-side rendering: https://remotion.dev/docs/ssr. Our recommended solution is to use the beta of Remotion Lambda: https://v3.remotion.dev/docs/lambda

I know this is brief - if you are serious about building this, join our Discord and chat with us to learn more details! Discord