DEV Community

Cover image for Single and multiple images upload and remove from Cloudinary using Node JS, Multer, MongoDB
MD ARIFUL HASAN
MD ARIFUL HASAN

Posted on • Updated on

Single and multiple images upload and remove from Cloudinary using Node JS, Multer, MongoDB

This system is working without using the file system of node. And I'm also using Thunder client (VS Code extension) for sending request, but you can also use Postman.

First create an ordinary Node JS application.

This is my folder structure and package.json file. I will be using these packages to do the work.
Image description

Go to Cloudinary and create a free account. After creating an account, you will find CLOUDINARY_NAME, CLOUDINARY_API_KEY, CLOUDINARY_API_SECRET in your account dashboard.

1# .env file
=> This file will contain all of the secret you don't want to show others
Image description

2# cloudinary.js file
=> Connects your application to cloudinary. Remember to use dotenv
Image description

3# cloudinaryAccountStorage.js file
=> This file will create a seperate folder to store all of your images in Cloudinary.
Image description

4# people.js file
=> People schema and people model for mongoose to store data in DB.
Image description

5# message.js file
=> Message schema and message model for mongoose to store data in DB.
Image description

6# server.js file
=> Every file is connected here. Remember to import and use dotenv.
Image description

7# uploadRouter.js file
=> Main routing file of this application. Send different request to different path.
Image description

8# imageUploader.js file
=> Universal image uploader file. Maximum file size, maximum file number, file type, and validation can control using this function.
Image description

9# avatarUpload.js file
=> Sending params to imageUploader.js for file size, file number and file type with error message. Most of the tutorial uses upload.single(), upload.array(), upload.fields() but I'm using upload.any()() to give you some idea how it works
Image description

10# attachmentUpload.js file
=> Sending params to imageUploader.js for file size, file number and file type with error message. Most of the tutorial uses upload.single(), upload.array(), upload.fields() but I'm using upload.any()() to give you some idea how it works
Image description

11# uploadController.js file
=> Structure and async function name of controller function. This file control upload and remove images from Cloudinary. It also sends json data to database.
Image description

11.1# addUser function of uploadController.js
=> Upload single image to Cloudinary and send public_id, secure_url to database of cloudinary upload.
Image description
Result of addUser function
Image description

11.2# deleteUser function of uploadController.js
=> Remove single image from Cloudinary also remove from database.
Image description
Result of deleteUser function
Image description

11.3# sendMessage function of uploadController.js
=> Upload multiple images to Cloudinary and send public_id, secure_url to database as an object of different cloudinary upload.
Image description
Result of sendMessage function
Image description

11.4# removeMsgAndAttachments function of uploadController.js
=> Remove multiple images from Cloudinary also remove from database.
Image description
Result of removeMsgAndAttachments function
Image description

Git repo of this code.
Thank you all.

Top comments (0)