Image Compressor is a tool designed to efficiently compress images.
- Motivation
- Requirements
- How to use
- Project structure
- Design
- Tests
- Lighthouse Report
- Preview
- Attributions
- License
- Author
I developed this application to apply the principles I've learned while studying PHP.
The goal is to create a user-friendly solution for image compression.
- PHP ^8.3.0
- Node ^20.6.0
Follow these steps to compress an image:
- Click on the "Upload Image" button.
- Select the image you want to compress (supports jpg, png, WebP; maximum file size: 10MB).
- Wait for the compression process to complete.
- Choose the location to save the compressed image.
/project-root
index.php # Main entry point for the application
src/
styles/ # CSS files for styling
media/ # Images, icons, videos
client/ # Client-side code (JavaScript)
server/ # Server-side code (PHP)
temp/ # Temporally server folders and files
template/ # HTML/PHP views
npm i # install the packages
npm run build # build the project on folder htdocs
npm run server # starts the PHP built-in in server
I create the design using the Material 3 design system.
The design is available here: Image Compressor.
I used Cypress to test the core functionality of the app.
The tests are available here: image-compressor-tests.
The project is available on Image Compressor
All media used in this app are free for usage, and the sources are credited below:
The code is under the MIT License.