Audio / Voice Recorder for React
npm install @altimus/audio-react-recorder> Audio / Voice Recorder w/ Audio Wave for React using the Web Audio API
 
``bash`
npm install --save audio-react-recorder
`jsx
import React, { Component } from 'react'
import AudioReactRecorder, { RecordState } from 'audio-react-recorder'
class App extends Component {
constructor(props) {
super(props)
this.state = {
recordState: null
}
}
start = () => {
this.setState({
recordState: RecordState.START
})
}
stop = () => {
this.setState({
recordState: RecordState.STOP
})
}
//audioData contains blob and blobUrl
onStop = (audioData) => {
console.log('audioData', audioData)
}
render() {
const { recordState } = this.state
return (
| Property name | Type | Default | Description |
| --------------- | ------------- | ------------------ | ---------------------------------------------------- |
| state | string | RecordState.NONE | RecordState.(NONE,START,STOP,PAUSE) |
| type | string | audio/wav | MIME type of the audio file |
| backgroundColor | string | rgb(200, 200, 200) | Background color of the audio wave / canvas |
| foregroundColor | string | rgb(0, 0, 0) | Foreground color of the audio wave / canvas |
| canvasWidth | number,string | 500 | Canvas width (you can use css to make it responsive) |
| canvasHeight | number,string | 300 | canvas height |
MIT © noobieprogrammer
