Giter VIP home page Giter VIP logo

resize-web-gui's Introduction

Resize web GUI

Resize one or more images with standard web format. GUI version, can be launched in the browser.


Resize web GUI is a onepage application which can convert one or mores images with standard web format, like png, jpeg, webp, avif and svg, and resize it to common responsive web size : 1920, 1536, 1280, 1024, 768, 640.

You can resize one or more images :

Only one image added by the user A lot of images added by the user

Thanks to Laracasts for the illustrations

Once you click on the "Resize and convert" button, you have a dynamic refresh of images grid, for each images being resized

Images start resizing Images start resizing

After that, you have a zip file if you upload multiples images, or directy a single image if you add only one.

For multiple images: All images are stored in separate folders. In these folders: one folder per format, then all sizes in the format folder.

Example of image organization Example of image organization

Quick installation on Linux

If you want to setup this locally, you basically need to install php, imagemagick, php-zip and php-imagick package, and launch a PHP server.

On debian :

sudo apt install php php-imagick php-zip

(php only if you don't already have php on your machine)

You also have to install Image magick :

sudo apt install imagemagick

After that, you can launch shell script for quick test and setup.

Make sure it is executable :

sudo chmod +x dev-start.sh

Then, you can run :

./dev-start.sh

And go to the url : http://localhost:8090

You should see the application page. If you have problem to load Imagick library, you get error message when you start resize some images.

The problem with this setup is, you have to restart the development server every time you restart your machine.

To avoid that, you can install Apache server locally, then add the path to the project in apache configuration file (etc/apache2/sites-available on Debian). You will also have to edit the /etc/hosts file.

What can be added and improved

  • Add drag-and-drop interface in HTML form.
  • Make embedded window, like the Electron framework, but with PHP

resize-web-gui's People

Contributors

axel-paillaud avatar

Stargazers

 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.