react-video-recordie

Video Recorder in React using MediaRecorder API

Install

Install via npm

npm install react-video-recordie

or via yarn

yarn add react-video-recordie

Demo

Check out the Storybook for a demo.

Usage

import React, { Component } from 'react';

import { VideoRecordie } from 'react-video-recordie';

class Example extends Component {
  render() {
    return <VideoRecordie />;
  }
}

Options/Props

onRecordingStart

A callback function that will be invoked when recording begins

type: () => void

onRecordingComplete

A callback function that will be invoked when recording ends

type: (video: Blob, videoUrl: string) => void

onPlay

A callback function that will be invoked when the recorded video is played

type: () => void

onPause

A callback function that will be invoked when the recording is paused

type: () => void

onResume

A callback function that will be invoked when the paused recording is resumed

type: () => void

mimeType

The MIME media type required for your video, defaults to 'video/webm'

type: string

allowPlayback

A boolean to enable or disable the ability to replay the recorded video

type: boolean

allowDownload

A boolean to enable or disable the ability to download the recorded video

type: boolean

filename

The name of the downloaded file, defaults to 'videorecordie.webm'

type: string

timeslice

The number of milliseconds to record into each blob, defaults to 1000 milliseconds

type: number

License

MIT © krisravishankar