ya332 / use-screen-recorder

React hook for easily recording screen using MediaStream APIs.

Home Page:https://www.npmjs.com/package/use-screen-recorder

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

use-screen-recorder

React hook for easily recording screen using MediaStream APIs.

NPM JavaScript Style Guide

Demo

Install

yarn add use-screen-recorder

Usage

import * as React from "react";

import useScreenRecorder from "use-screen-recorder";

const Example = () => {
  const {
    blobUrl,
    pauseRecording,
    resetRecording,
    resumeRecording,
    startRecording,
    status,
    stopRecording,
  } = useScreenRecorder();

  return (
    <div>
      <video src={blobUrl} />

      <small>Status: {status}</small>

      <button onClick={startRecording}>Start Recording</button>
      <button onClick={stopRecording}>Stop Recording</button>
      <button onClick={pauseRecording}>Pause Recording</button>
      <button onClick={resumeRecording}>Resume Recording</button>
      <button onClick={resetRecording}>Reset Recording</button>
    </div>
  );
};

Props

audio

A boolean value indicating if audio track should be added.

type: boolean
default: false

options

A MediaRecorderOptions object.

type: object
default: {}

License

MIT © ishan-chhabra See the LICENSE file for more information


This hook is created using create-react-hook.

About

React hook for easily recording screen using MediaStream APIs.

https://www.npmjs.com/package/use-screen-recorder


Languages

Language:JavaScript 43.6%Language:TypeScript 34.6%Language:CSS 16.7%Language:HTML 5.1%