11# S3 Image Manager
22
3- This simple S3 image manager allows you to:
3+ S3 Image Manager allows you to:
44- Optimize images with Sharp
55 - Change quality
66 - Change format
77 - Resize
88 - Clone (to create multiple versions of the same image)
99- Download processed images
10+ - View images stored in S3
1011- Upload images to S3
1112- Search images in S3
1213- Delete images in S3
@@ -16,15 +17,34 @@ Run it on localhost to optimize and upload images to S3. Retrieved links of uplo
1617## Preview
1718
1819### Modification
20+ - Change quality
21+ - Change format
22+ - Resize
23+ - Clone (to create multiple versions of the same image)
24+
1925![ Modify] ( assets/modify.png )
2026
2127### Upload/Download
28+ - Download processed images
29+ - Set S3 namespace for the image
30+ - Upload images to S3
31+
2232![ Upload/Download] ( assets/upload-download.png )
2333
2434### S3 for serving images
35+ - View images stored in S3
36+ - Upload images to S3
37+ - Search images in S3
38+ - Delete images in S3
39+
2540![ S3 Server] ( assets/s3-server.png )
2641
2742## S3 for storing images
43+ - View images stored in S3
44+ - Upload images to S3
45+ - Search images in S3
46+ - Delete images in S3
47+
2848![ S3 Storage] ( assets/s3-storage.png )
2949
3050## Pre-requisites
@@ -66,14 +86,14 @@ Run it on localhost to optimize and upload images to S3. Retrieved links of uplo
66865 ) Open your browser and go to ` http://localhost:3010 `
6787
6888## How to use
69- 1 ) ** Run it on localhost** < small >(npm run dev)</ small >
70- - <small ># 1 Optimization Form </small >
71- 2 ) ** Select image from filesystem **
72- 3 ) ** Fill in quality and size ** < small >(at least height or width has to be filled in, Sharp will calculate the other parameter automatically)</ small >
73- 4 ) ** Click optimize ** < small >-> optimized image will be previewed in the Upload Form</ small >
74- - < small > # 2 Upload Form</ small >
75- 5 ) ** Fill in the new image name ** (technically S3 namespace) < small >-> it will be automatically prefixed with assets/</ small >
76- 6 ) ** Click upload ** < small >-> image will be uploaded to S3 bucket and Cloudfront link will be returned</ small >
89+ 1 ) ** Run it on localhost:3010 **
90+ 2 ) ** Modify images ** <small >(change quality, format, resize, clone) </small >
91+ 3 ) ** Upload images to S3 ** < small >(set S3 namespace for the image)</ small >
92+ 4 ) ** Download processed images **
93+ 5 ) ** Manage images in S3 **
94+ - View images stored in S3
95+ - Search images in S3
96+ - Delete images in S3
7797
7898## Notes
79991 ) Animations / GIFs are not supported
0 commit comments