A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://cloudinary.com/documentation/crop_and_resize_videos_in_react_tutorial below:

Crop and Resize Videos in React (Video Tutorial)

Last updated: Aug-06-2025

Overview

Learn how to dynamically generate videos at different sizes and aspect ratios using React with Cloudinary cropping and resizing.

Video tutorial

You can find the code from this tutorial in

GitHub

.

Tutorial contents

This tutorial presents the following topics. Click a timestamp to jump to that part of the video.

Resize and crop videos with Cloudinary Add Cloudinary React and configure   0:20 Add the Cloudinary React package to your code and configure it with your credentials. Add a YouTube version of the video   0:35 Add a Youtube version of the video and set the aspect ratio to 16:9. Add more versions and change their aspect ratios   1:05 Add more versions of the video and change their aspect ratios to see the difference. Use the fill mode instead of scaling the video. Use automatic gravity and focus on the face   1:34 Add the autoGravity and autoFocus parameters to use the AI capabilities of Cloudinary and focus on the face in the video. Compare the different versions side-by-side   3:09 Set the aspect ratios to be the same and then you can compare the difference. Keep learning If you like this, you might also like...

 

 

Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.

 

✔️ Feedback sent!

✖️   Error

Unfortunately there's been an error sending your feedback.

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4