Uploading images to Amazon S3

Implementing file uploads and storing files is always a huge task, especially for image uploads in which the user may want to edit their files again.

For our frontend, the user should be able to drag and drop their image into a dropzone, crop the image, and then submit it when they are finished. The backend needs to accept file uploads in general, which is not easy at all. The files must be processed and then stored efficiently so that all users can access them quickly.

As this is a vast topic, the chapter only covers the basic upload of images from React, using a multipart HyperText Transfer Protocol (HTTP) POST request to our GraphQL API, and then transferring the image to our S3 bucket. When it comes to compressing, converting, and cropping, you should check out further tutorials or books on this topic, including techniques for implementing them in the frontend and backend, since there is a lot to think about. For example, in many applications...