{"id":13616392,"url":"https://github.com/naamhaiabdullah/compressioweb","last_synced_at":"2025-04-14T00:32:18.015Z","repository":{"id":53932607,"uuid":"409991309","full_name":"naamhaiabdullah/compressioweb","owner":"naamhaiabdullah","description":"CompressioWeb is a Open Source Production Grade Image Compression API and Web Application. It compresses JPG, PNG, GIF \u0026 SVG images in both Lossy and Lossless formats.","archived":false,"fork":false,"pushed_at":"2022-11-17T21:25:00.000Z","size":7536,"stargazers_count":147,"open_issues_count":0,"forks_count":27,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-08-02T20:48:10.758Z","etag":null,"topics":["compress-images","express","image-compression","nodejs","open-source"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/naamhaiabdullah.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-09-24T14:20:50.000Z","updated_at":"2024-07-02T12:09:58.000Z","dependencies_parsed_at":"2022-08-13T04:50:37.106Z","dependency_job_id":null,"html_url":"https://github.com/naamhaiabdullah/compressioweb","commit_stats":null,"previous_names":["naamhaiabdullah/compressioweb"],"tags_count":11,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/naamhaiabdullah%2Fcompressioweb","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/naamhaiabdullah%2Fcompressioweb/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/naamhaiabdullah%2Fcompressioweb/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/naamhaiabdullah%2Fcompressioweb/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/naamhaiabdullah","download_url":"https://codeload.github.com/naamhaiabdullah/compressioweb/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223611986,"owners_count":17173557,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["compress-images","express","image-compression","nodejs","open-source"],"created_at":"2024-08-01T20:01:27.906Z","updated_at":"2024-11-08T00:31:27.078Z","avatar_url":"https://github.com/naamhaiabdullah.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"## CompressioWeb \u0026middot; [![License: GPL v3](https://img.shields.io/badge/License-GPLv3-blue.svg)](https://www.gnu.org/licenses/gpl-3.0)\n\n```\n1. CompressioWeb is an Open Source Production Grade Image Compression API and Web Application.\n2. Privacy friendly, no database, no analytics, no logs, no cookies and auto image deletion in an hour after upload.\n3. It compresses JPG, PNG, GIF \u0026 SVG images in both Lossy and Lossless formats.\n4. CompressioWeb is built with Node.js, Express.js and React.js.\n5. Libraries used are JPEGOptim, PNGQuant, OptiPNG, GIFSicle, Scour.\n6. CompressioWeb is fully maintained and will be available in future with all the updates.\n7. Installation docs for DigitalOcean Ubuntu 20.04 is given below.\n```\n\n## Built With\n\n* [Node.js](https://nodejs.org) - Backend\n* [Express.js](https://expressjs.com) - Backend Framework\n* [React.js](https://reactjs.org/) - Frontend Library\n* [PNGQuant](https://pngquant.org/) - PNG Compression Library\n* [OptiPNG](http://optipng.sourceforge.net/) - PNG Compression Library\n* [JPEGOptim](https://www.mankier.com/1/jpegoptim) - JPEG Compression Library\n* [GIFSicle](https://www.lcdf.org/gifsicle/) - GIF Compression Library\n* [Scour](https://www.codedread.com/scour/) - SVG Compression Library\n\n## Authors\n\n* **Choudhary Abdullah** - API and Frontend - [LinkedIn](https://www.linkedin.com/in/abdullahchoudhary/)\n* **Fahad Ahmad** - Frontend - [LinkedIn](https://www.linkedin.com/in/fahad-ahmad-b042a7112/)   \n\n## Screenshots\n\n![alt text](https://github.com/twoabd/CompressioAPI/blob/main/api/docs/website/first.png?raw=true)   \n\n![alt text](https://github.com/twoabd/CompressioAPI/blob/main/api/docs/api/default.png?raw=true)  \n\n![alt text](https://github.com/twoabd/CompressioAPI/blob/main/api/docs/api/lossy.png?raw=true)  \n \n![alt text](https://github.com/twoabd/CompressioAPI/blob/main/api/docs/api/lossless.png?raw=true) \n\n\n## How to Use API\n\n#### POST Request, No GET\n```\nIt receives all parameters in a POST request at https://compressio.app/compress.     \nYou can choose maximum 10 images at a time.\nTotal image size can't be larger than 50MB.\nSend image with 'inImgs' key through POST request.\n```\n\n#### Compression Type\n```\nBy Default image compression type is lossy.   \nYou can choose lossless compression with 'isLossy' key and value 'false' through POST request.\n```\n\n#### Compression Quality\n```\nNote : Compression Quality (imgQuality) won't work if isLossy is set to false.  \nYou can choose between 1-100 with 'imgQuality' key and value through POST request. \n\nDefault JPG, PNG, SVG Image Compression Quality = 85.\nDefault GIF Image Compression Quality = 50.   \nYou can choose between 1-100 with 'imgQuality' key and value through POST request.\nFor GIF, do not choose any value lower than 50, quality loss will be significant.\n```\n\n#### Strip Meta\n```\nBy Default image metadata will be stripped.   \nYou can choose not to strip meta with 'stripMeta' key and value 'false' through POST request.\n```\n\n## Versioning\n\nWe use [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://github.com/twoabd/CompressioWeb/tags). \n\n\n## Deployment, API \u0026 Web\n\n#### Change compressio.app to Your Domain At\n```\n/api/app.js\n/api/src/routes/compress.js\n/client/src/Components/AfterUpload.js\n```\n\n#### Remove Navbar Links From\n```\n/client/src/Components/Navbar.js\n```\n\n#### Install Nginx (Currently v1.18.0) and NodeJs LTS (Currently v14.17.6) on Ubuntu 20.04\n```\nsudo apt update\nsudo apt install nginx -y\n\ncurl -sL https://deb.nodesource.com/setup_14.x | sudo bash -\ncat /etc/apt/sources.list.d/nodesource.list\nsudo apt  install nodejs -y\nnode  -v\n```\n\n#### Install PNGQuant, JPEGOptim, Gifsicle, Scour\n\n```\nsudo apt install jpegoptim\nsudo apt install pngquant -y\nsudo apt install optipng\nsudo apt install gifsicle\nsudo apt install scour -y\n```\n\n#### Updating Nginx conf in etc/nginx/nginx.conf\n```\nuser www-data;\nworker_processes auto;\npid /run/nginx.pid;\ninclude /etc/nginx/modules-enabled/*.conf;\n\nevents {\n\tworker_connections 768;\n\tmulti_accept on;\n}\n\nhttp {\n\n\t# Basic Settings\n\tsendfile on;\n\ttcp_nopush on;\n\ttcp_nodelay on;\n\tkeepalive_timeout 65;\n\ttypes_hash_max_size 2048;\n        client_max_body_size 20M;\n\n\tinclude /etc/nginx/mime.types;\n\tdefault_type application/octet-stream;\n\n\n\t# SSL Settings\n\tssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;\n\tssl_prefer_server_ciphers on;\n\n\n\t# Logging Settings\n\taccess_log /var/log/nginx/access.log;\n\terror_log /var/log/nginx/error.log;\n\n\n\t# Gzip Settings\n\tgzip on; \n\tgzip_disable \"msie6\";\n\tgzip_vary on;\n\tgzip_proxied any;\n\tgzip_comp_level 6;\n\tgzip_buffers 16 8k;\n\tgzip_http_version 1.1;\n        gzip_types \n\tapplication/javascript application/rss+xml application/vnd.ms-fontobject application/x-font \n\tapplication/x-font-opentype application/x-font-otf application/x-font-truetype application/x-font-ttf \n\tapplication/x-javascript application/xhtml+xml application/xml font/opentype font/otf font/ttf \n\timage/svg+xml image/x-icon text/css text/html text/javascript text/plain text/xml;\n\n\tinclude /etc/nginx/conf.d/*.conf;\n\tinclude /etc/nginx/sites-enabled/*;\n}\n```\n\n#### Creating API Directory\n\n```\nsudo mkdir -p /var/www/compressio.app/api\nsudo mkdir -p /var/www/compressio.app/client\n\nsudo chown -R www-data:www-data /var/www/compressio.app\nsudo chmod -R 755 /var/www/compressio.app\n```\n\n#### Creating 404 Page\n\n```\nsudo nano /var/www/compressio.app/client/404.html\n\u003c!DOCTYPE html\u003e\u003chtml lang=\"en\"\u003e\u003chead\u003e\u003cmeta charset=\"utf-8\"\u003e\u003cmeta name=\"viewport\" content=\"width=device-width,initial-scale=1\"\u003e\u003ctitle\u003ePage Not Found\u003c/title\u003e\u003clink rel=\"shortcut icon\" href=\"/favicon.png\" type=\"image/png\"\u003e\u003clink rel=\"dns-prefetch\" href=\"//fonts.gstatic.com\"\u003e\u003clink href=\"https://fonts.googleapis.com/css?family=Nunito\" rel=\"stylesheet\"\u003e\u003cstyle\u003ebody,html{background-color:#fff;color:#636b6f;font-family:Nunito,sans-serif;font-weight:100;height:100vh;margin:0}.full-height{height:100vh}.flex-center{align-items:center;display:flex;justify-content:center}.position-ref{position:relative}.code{border-right:2px solid;font-size:26px;padding:0 15px 0 15px;text-align:center}.message{font-size:18px;text-align:center}\u003c/style\u003e\u003c/head\u003e\u003cbody\u003e\u003cdiv class=\"flex-center position-ref full-height\"\u003e\u003cdiv class=\"code\"\u003e404\u003c/div\u003e\u003cdiv class=\"message\" style=\"padding:10px\"\u003eNot Found\u003c/div\u003e\u003c/div\u003e\u003c/body\u003e\u003c/html\u003e\n```\n\n#### Creating Virtual Host\n```\nsudo nano /etc/nginx/sites-available/compressio.app\nserver {\n\n    server_name compressio.app;\n    index index.html;\n   \n    # API Folder\n    location /api/compress {\n        proxy_pass http://localhost:3001/compress;\n        proxy_http_version 1.1;\n        proxy_set_header Upgrade $http_upgrade;\n        proxy_set_header Connection 'upgrade';\n        proxy_set_header Host $host;\n        proxy_cache_bypass $http_upgrade;\n        proxy_read_timeout 30s;\n    }\n    \n    # Input Folder\n    location /api/input {\n        root /var/www/compressio.app;\n    }\n\n\t# Output Folder\n    location /api/output {\n        root /var/www/compressio.app;\n    }\n\n    # Client Folder\n    location / {\n        expires 1d;\n        error_page 404 /404.html;\n        root /var/www/compressio.app/client;\n    }\n\n}\nsudo ln -s /etc/nginx/sites-available/compressio.app /etc/nginx/sites-enabled/\nsudo unlink /etc/nginx/sites-enabled/default\nsudo rm -rf /var/www/html\nsudo systemctl restart nginx\n```\n\n#### Installing SSL\n```\nsudo apt install certbot python3-certbot-nginx -y\nsudo certbot --nginx -d compressio.app\nsudo systemctl status certbot.timer\nsudo certbot renew --dry-run\nsudo systemctl restart nginx\n```\n\n#### Copy Repo Files to /var/www/compressio.app\n```\ncd /var/www/compressio.app/api\nnpm install\n\ncd /var/www/compressio.app/client\nnpm install\nnpm run build \n  \nDelete everything else inside /var/www/compressio.app/client/ except 404.html and build folder\nMove all files inside /var/www/compressio.app/client/build/ to /var/www/compressio.app/client/ \n```\n\n#### Run Api Server\n```\ncd /var/www/compressio.app/api\nnpm install -g pm2\npm2 start app.js -n CompressioAPI\npm2 startup\npm2 save\n```\n\n## Acknowledgments\n\n* Frontend is inspired from [Caesium Image Compressor](https://caesium.app)\n* Learnt about all the five compression libraries from [Compressor.io](https://compressor.io/) when it was free.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnaamhaiabdullah%2Fcompressioweb","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnaamhaiabdullah%2Fcompressioweb","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnaamhaiabdullah%2Fcompressioweb/lists"}