Nodejs, Express, and MongoDB Image CRUD API and save on Local computer disk
Tags: javascript, node, crud, api
Published: 2022-04-01 20:11:22

In this tutorial, we are learning Image CRUD Operations In Nodejs, Express, And MongoDB. This Image saves on your computer disk and also if you delete any image, this image will be deleted on your computer disk. This tutorial may help you to get started on how Image handling.

**Prerequisites**
Before we move on, you’ll need to have the following:
1. Node.js installed on your machine.
2. setup mongoDB on you computer.

**Step-1**
Create a Database on your MongoDB and also collection name.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m38s4s2d36cffa7frezr.png)

**Step-2**
open your cmd terminal and type npm init -y
and install following package.

- 1. express
- 2. multer
- 3. mongoose
- 4. body-parser
- 5. nodemon
go to https://www.npmjs.com/ sit and find out this package.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l3zwlpwe9fjxw9iw2x64.png)

**Step-3**
following file structure do I have

- 1. index.js
- 2. app.js
- 3. src folder
    1. controller-> UserController.js
    2. models-> User.js
    3. routes-> api.js
    4. utils->fileUpload.js
- 4. storage/images

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/juo87w83plaqpaq7sfii.png)

**Step-4**
go to the src/routes/api.js file and write as the following image

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wjpj8hs4r3i7fpo5y8j8.png)

**Step-5**
now open app.js and the following image

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z0ytpoqy5kqt2whxyh0r.png)

**step-6**
then open index.js and do the same thing

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/crembg1eqnpgofihagej.png)

**Step-7**
Now Testing your app. go to Terminal and type nodemon index.js. if all is ok then showing as the image.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i58ycciqmmb9xrzsr46q.png)

**Step-8**
go to the src/utils/fileUpload.js file and write as the following image

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1x6b7j678711ui8vmw0r.png)

**Step-9**
Then we create our first router. go to the src/routes/api.js and follow the image.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mk231rh458dbbfys600u.png)

**Step-10**
Then write your model on your database.[src/model/User.js]

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/71j5kak14elo3sofgjpr.png)

**Step-11**
Go to user controller. [src/controllers/UserControllers.js]

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sfoegcpd3o8gxgeh9a88.png)

**Step-12**
Now, test api. open your postman and follow the image.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xdqka8im37k7y2itbkje.png)

When you click send button then show this information

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wlib2kr68zoe8gdi2578.png)

This image also save on your local computer disk

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/06x99relhzg9mi7r3peo.png)
and save also on your mongoDB database with folder location

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nhz82rinkfbyf3d9ytes.png)

> **Now Image Create is Done.**
 
**Then we working Showing this Information.**

**Step-13**
go to api.js and follow the image [src/routes/api.js]

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a4nwpjedjrnxvbubnr10.png)

**Step-14**
go to User Controller [src/controller/UserController.js]

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v1s3sez5mbzdh09zpxsi.png)
Go to postman 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/00f1uzajc809q86cdg6x.png)
if you click this image which is red mark this image showing on your browser tab.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yjrudvuhayegnu3mj92w.png)

> **Now Image Showing is Done.**
**Then we working Update Information.**

**Step-15**
go to api.js and follow the image [src/routes/api.js]

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xgtemy2zuhgqhs0femie.png)

**Step-16**
go to User Controller [src/controller/UserController.js]

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l0rz8d8qbgrwuvneme3j.png)

Go to postman 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/an2116kviy40cjtdj9z6.png)

As a result, previous image delete on your computer disk and save a new image on your computer and also update your mongoDB database.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b95tdwn2c0ctbw32aw4v.png)

> **Now Image Update is Done.**
**Then we working Delete Image**

**Step-17**
go to api.js and follow the image [src/routes/api.js]

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ntbzkf20aov1bs2i3ku0.png)

**Step-18**
go to User Controller [src/controller/UserController.js]


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7615s4vz9fvjm6bae6q3.png)

Go to postman 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b2xpu7ny0mab8y9zmctq.png)

As a result, Image is deleted on local disk and also your database.

your local disk
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uwzn3u52769wliima21f.png)

your mongoDB Database

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s86o13u30bfz8n0gummw.png)


here is the GitHub link. I hope you enjoy this article. please give me a star on my GitHub repository. thanks.

https://github.com/kamruzzamanripon/express-image-crud-api