This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend
What I Built
I built Image-Resizer-App, a modern, frontend-only web application designed to solve a frustrating problem encountered during online application processes: strict image dimension and file-size constraints (such as staying under 15 KB while maintaining clear resolution).
Many people—including friends and family filling out government exam applications, scholarship portals, passport applications, and job forms—struggle with standard image tools that stretch images, blur text/signatures, or produce files that exceed strict upload limits.
This tool solves that problem by allowing users to:
Demo
https://shah-shivam-410.github.io/Image-Resizer-App/
Code
https://github.com/shah-shivam-410/Image-Resizer-App
How I Built It
The application is built using modern frontend technologies and client-side processing libraries:
Framework & Tooling: React, Vite, and Tailwind CSS for a fast, responsive user interface.
Image Processing Engine: Uses Pica for high-quality image resampling and canvas-based algorithms alongside browser-image-compression (with binary search optimization) to reach target KB sizes efficiently.
Development Assistance: I leveraged GitHub Copilot (Free Tier) as an AI coding assistant to accelerate component scaffolding, optimize the unit conversion formulas (cm-to-pixel at specific DPIs), and streamline the image compression algorithm setup.
Why Does Open Innovation Matter?
Open-source tooling and client-side web technologies enable developers to build fast, secure utility apps without server overhead or costs. By processing sensitive documents entirely within the user's browser, this approach ensures complete privacy while eliminating reliance on external cloud APIs.
Prize Categories
Best Use of GitHub Copilot
Top comments (0)