Expose a React hook for camera access and photo capture in browsers.
npx skills add https://github.com/caffeinelabs/skills --skill extension-camera
Please help me install this Agent Skill. Skill: extension-camera Source: https://github.com/caffeinelabs/skills/tree/main/skills/extension-camera Command: npx skills add https://github.com/caffeinelabs/skills --skill extension-camera
Integrating camera access, live previews, and reliable photo capture into web applications is error-prone and platform-dependent. This Skill provides a ready-to-use React hook and guidance to remove boilerplate, manage permissions, and surface clear errors so developers can add camera features quickly and safely.
Use the useCamera hook to start the camera, switch to the environment-facing camera when available, and capture a photo for upload.
High-intent search queries and answers about installing and using this skill.
To access a webcam in React and capture a photo, use a dedicated hook that manages the camera lifecycle and exposes capturePhoto, videoRef, and canvasRef, removing the need for manual browser API boilerplate and handling permissions safely.
Handling camera permissions and errors in a web application involves checking for not-supported, not-found, timeout, and loading states to drive UI feedback and retries, which the provided React hook manages to surface clear errors during live previews.
Yes, you can switch between front and back cameras in a mobile browser UI using the switchCamera function exposed by the React hook, allowing you to toggle the facing mode for profile photo capture or QR scanning.
The best way to add live camera previews to a web application is using a React hook that manages starting and stopping the camera while exposing videoRef, ensuring responsive layout requirements are met without complex platform-dependent setup.
Yes, this React camera hook works for QR code or barcode scanning by providing a live preview and reliable photo capture, enabling web and mobile browser UIs to process user-taken photos or scan documents efficiently.
yuheitomiConfigure Biome and Shadcn/UI preferences in React projects with pnpm.
peterbamuhigireStandardize photo upload, preview, storage, and deletion flows across modules.
caffeinelabsScan QR codes with the device camera and decode embedded data using jsQR.
Arupbiswas09Capture images and videos with live preview in React Native apps.