[FIXED] What are some ways of storing images when using MongoDB Express React and Node.js?

Issue

I am currently working on a project that has a Shoe model, as of right now I am only populating the image of the shoe with a imgUrl, but I would like to store images if possible. I know that I could use MongoDB and GridFS but from what I've read many say that MongoDB really isn't meant for storing large files. What would be recommended then? and how could I implement it in my MERN application?

Solution

MongoDB is not a good place for storing files. If you want to store files, you should use storages like Amazon S3 or Google Could Storage.

The good practice is to store the files in a storage and then to just save the URL of the uploaded image in the MongoDB.

When it comes to Node.js and Express, I would suggest multer package middleware, which is primarily used for uploading files. If you would use Amazon S3 for a storage, there is also a plug-in multer-s3 package that can be helpful.

You can check this video on how to configure Multer and implement image upload on your Node.js server. Once the image is uploaded, Multer will return data to you with destination field included. You can then save that destination in the MongoDB.

Answered By - NeNaD

Answer Checked By - Willingham (PHPFixing Volunteer)