An open API service indexing awesome lists of open source software.

https://github.com/tonmoydeb404/webcamio

A feature-rich webcam recording app built with React, TypeScript, TailwindCSS, and react-media-recorder. Supports mute/unmute, aspect ratio adjustments, and quality control. 🚀
https://github.com/tonmoydeb404/webcamio

react-webcam webcam webcamio

Last synced: about 1 month ago
JSON representation

A feature-rich webcam recording app built with React, TypeScript, TailwindCSS, and react-media-recorder. Supports mute/unmute, aspect ratio adjustments, and quality control. 🚀

Awesome Lists containing this project

README

          

# WebCamio App

A React-based webcam application with recording capabilities, built using React, TypeScript, TailwindCSS, and react-media-recorder.

## Features

- **Mute/Unmute**: Toggle microphone audio while recording.
- **Aspect Ratio**: Adjust video display dimensions for different aspect ratios.
- **Quality**: Configure video quality settings for optimal performance.

## Tech Stack

- **React** (with TypeScript)
- **TailwindCSS** (for styling)
- **react-media-recorder** (for media recording)

## Installation

1. Clone the repository:
```sh
git clone https://github.com/tonmoydeb404/webcamio.git
cd webcam-app
```
2. Install dependencies:
```sh
pnpm install
```
3. Start the development server:
```sh
pnpm run dev
```

## Usage

1. **Start Recording**: Click the "Start Recording" button to begin.
2. **Mute/Unmute**: Toggle audio recording using the mute button.
3. **Adjust Aspect Ratio**: Change aspect ratio settings for different layouts.
4. **Stop Recording**: Click "Stop Recording" to finish and save the video.
5. **Download Video**: Export recorded videos for local storage.

## Contributing

Contributions are welcome! Feel free to fork this project and submit a pull request.