photo-management

Standardize photo upload, preview, storage, and deletion flows across modules.

23|7|Updated Jan 23, 2026

Search Tags:#security #client-side #upload #gallery #photo #image-compression

Ready to run

npx skills add https://github.com/peterbamuhigire/skills-web-dev --skill photo-management

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: photo-management
Source: https://github.com/peterbamuhigire/skills-web-dev/tree/main/photo-management
Command: npx skills add https://github.com/peterbamuhigire/skills-web-dev --skill photo-management

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Managing photo uploads, previews, storage, and deletion consistently across modules to reduce UI inconsistencies and data gaps.

Core Features & Use Cases

Client-side compression: compress images before upload to save bandwidth and storage, using the Image Compression skill.
Per-entity photo rules: enforce 1 photo for people-based entities and up to 3 photos for non-people entities.
UX gallery patterns: provide a consistent card/list UI with preview, upload, and delete actions; supports lightbox previews and status indicators.

Quick Start

Compress client-side images before upload, enforce per-entity photo limits (1 for people, 3 for others), and implement a responsive gallery with previews and delete actions.

Frequently Asked Questions about photo-management

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I standardize photo upload and deletion flows across multiple modules?▼

Standardizing photo upload and deletion flows requires enforcing consistent client-side compression, per-entity photo limits, and server-side validation. This approach ensures consistent UX and data integrity across people-based and non-people entities.

What is client-side image compression and why use it before uploading photos?▼

Client-side image compression reduces image file size in the browser before upload. This process saves network bandwidth and server storage space, ensuring faster uploads while maintaining standardized photo previews.

How do I enforce different photo upload limits for people versus other entities?▼

Enforcing photo upload limits involves applying per-entity rules: allowing 1 photo for people-based entities and up to 3 photos for non-people entities. Server-side validation ensures these constraints maintain data integrity.

How do I build a UI gallery with photo previews and delete actions?▼

Building a UI gallery with previews and delete actions involves implementing responsive card or list patterns. These patterns support lightbox previews and status indicators to provide a consistent user experience across modules.

Does standardized photo upload require server-side validation for security?▼

Yes, standardized photo upload requires server-side validation per the security baseline. Loading the Vibe Security Skill for upload flows ensures that client-side compression and gallery UI patterns remain protected against data gaps.

What are the limitations of client-side photo compression for upload standardization?▼

Limitations of client-side photo compression include relying on browser processing capabilities and strict per-entity limits. You must still implement server-side validation to enforce constraints like 1 photo for people and 3 for others.