Use-record-mp3 NPM

use-record-mp3

Record MP3s in React using hooks

Install

npm i use-record-mp3

Usage

import useUserMedia from "react-use-user-media";
import useRecordMp3 from "use-record-mp3";

const constraints = { audio: true };

const Example = () => {
  const { stream } = useUserMedia(constraints);
  const {
    isRecording,
    startRecording,
    stopRecording,
    blobUrl,
    channelData,
  } = useRecordMp3(stream, {
    vbrQuality: 2, // 1 (highest) to 9 (lowest)
  });

  return (
    <div>
      <button onClick={isRecording ? stopRecording : startRecording}>
        {isRecording ? "Stop" : "Record"}
      </button>
      {blobUrl && <audio controls src={blobUrl}></audio>}
    </div>
  );
};

Instead of vbrQuality you can specify bitrate (e.g. 96, 128).