stpl-webcam

A React component for capturing webcam video and images, inspired by react-webcam.

Installation

Install the package via npm:

npm install stpl-webcam

or using Yarn:

yarn add stpl-webcam

Usage

Here is a basic example of how to use the Webcam component in your React application:

import React from 'react';
import Webcam from 'react-webcam-like';

const App = () => {
  const handleUserMedia = (stream) => {
    console.log('Webcam stream: ', stream);
  };

  return (
    <div>
      <h1>Webcam Capture</h1>
      <Webcam 
        width={640} 
        height={480} 
        screenshotFormat="image/jpeg" 
        onUserMedia={handleUserMedia} 
      />
    </div>
  );
};

export default App;

Props

width (optional) Type: number Default: 640 Description: Width of the video element.

height (optional) Type: number Default: 480 Description: Height of the video element.

screenshotFormat (optional) Type: string Default: 'image/jpeg' Description: The format of the screenshot image.

videoConstraints (optional) Type: MediaTrackConstraints Description: Constraints to apply to the video stream. See MDN documentation for more details.

onUserMedia (optional) Type: (stream: MediaStream) => void Description: Callback function that is invoked when the user's media stream is available.

Development

Prerequisites

Ensure you have Node.js and npm installed. You can check if you have them installed by running: node -v npm -v

Installing Dependencies

npm install