Skip to main content

Getting Started

Welcome to RNVideoEditor, a powerful library for editing videos in your React Native applications. This guide will walk you through the steps to integrate RNVideoEditor into your project.

Prerequisites​

Before you get started, ensure you have the following prerequisites in place:

  • Node.js: Make sure you have Node.js version 16.14 or above installed on your system.

  • React Native: Ensure you have React Native installed and your development environment set up.

Installation (Bare React Native)​

If you are using bare React Native, follow these steps to integrate RNVideoEditor into your project.

1. Install the Package​

You can install RNVideoEditor using npm or yarn:

yarn add rnvideoeditor

Android Configuration​

RNVideoEditor has specific Android requirements that you need to configure in your project:

  • minSdkVersion: Set the minimum SDK version to 24 in your Android project's build.gradle file.

  • compileSdkVersion and targetSdkVersion: Set both compileSdkVersion and targetSdkVersion to 33 in your Android project's build.gradle file.

Here's an example of how to update your Android project's build.gradle file:

android {
    compileSdkVersion 33
    defaultConfig {
        minSdkVersion 24
        targetSdkVersion 33
        // YOUR GRADLE CONFIG
    }
    // ...
}

Start the developmnt​

Run your project with:

react-native run android

Usage with expo​

Currently, you can't use this library with the Expo-Go app,but you can easily use this with the custom dev client

Install into your expo-managed project​

npx expo install rnvideoeditor

Now you need to set the below properties:

  • minSdkVersion to 24,
  • compileSdkVersion to 33
  • targetSdkVersion to 33,

You can do this by installing expo-build-properties

Adding expo-build-properties

npx expo install expo-build-properties

Now, open your app.config.*{js,ts} or app.json ,inside the expo section,go to plugins ssectios and add below config

[
  "expo-build-properties",
  {
    "android": {
      "minSdkVersion": 24,
      "compileSdkVersion": 33,
      "targetSdkVersion": 33,
      "buildToolsVersion": "33.0.0"
    }
  }
]

After adding those properties, you need to prebuild your app or alternatively, you can build your own dev client with EAS

# prebuild your app
npx expo prebuild

#run on android
npx expo run android

And you are setup to use !