Using FFMPEG with React

How can i use ffmpeg with react ? . I’m trying to crop a video

No, it’s an application that runs on a computer. If it’s to be used in a web app it needs to run on a computer, so it has to be server side. You can’t really do much video editing in browser, it’s a hugely resource-intensive process. There are a few libraries, and I would guess there will be some good WASM solutions in the future, but video editing isn’t really a good usecase for a browser app as things stand.

1 Like


Do you know how i can trim html video canvas

You would create a timeline UI that is seperate to the video player UI. You would connect the two so that the timeline size === the length of time in the video, and scrubbing the timeline scrubs the video. Then the timeline would have cut/trim etc tools. Once you had that, you can send the data created from the timeline tools (which will specify at what points the video would be trimmed) to a server. On the server you would create a new video using something like ffmpeg that takes the original video + the parameters created using the timeline UI.

The actual HTML <video> element, that’s just a video player, it doesn’t do anything apart from that.

I’m sorry, this is not a simple thing at all: video editing is extremely resource intensive, it’s not something you want to do in a browser, it’s non-trivial. That being said, if you know that the video file will always be very small, then there are probably some libraries available if you Google for them.

1 Like

Thanks DanCouper . Appreciate this