1 00:00:02,140 --> 00:00:03,680 Now that we are able to insert data, 2 00:00:03,700 --> 00:00:09,270 let's also get data and for that, I will grab this entire mongo client code here, 3 00:00:09,550 --> 00:00:17,440 copy it and we'll soon find a better solution and move over to my get/ method which is the method 4 00:00:17,470 --> 00:00:21,570 that is triggered by requests that want to fetch all product data. 5 00:00:21,580 --> 00:00:25,980 Now here we will use mongodb, I'll comment out this code for now 6 00:00:26,260 --> 00:00:33,150 and here, I'll then paste in my code for well interacting with mongodb. 7 00:00:33,310 --> 00:00:38,920 Now I still want to connect and use that client to reach out to the products collection but I don't want 8 00:00:38,920 --> 00:00:40,140 to insert anything, 9 00:00:40,240 --> 00:00:45,110 instead I'll now use find because I want to get all products here, 10 00:00:45,220 --> 00:00:47,550 so find gives me all products, right. 11 00:00:48,010 --> 00:00:56,620 Well almost, what does find give us in detail? If you remember to read module, find gives us a cursor, 12 00:00:56,860 --> 00:01:02,400 so we should use that cursor here to traverse through our data and just as before, 13 00:01:02,530 --> 00:01:08,020 you'll learn more about the cursor in the official driver docs by searching for the cursor object here 14 00:01:08,530 --> 00:01:13,300 and you'll see all the methods you can execute on the cursor and how they work and how you can interact 15 00:01:13,300 --> 00:01:15,100 with the cursor. 16 00:01:15,160 --> 00:01:21,220 So we get back such a cursor and I simply want to go through all the documents I get back and then do 17 00:01:21,220 --> 00:01:22,520 something with them, 18 00:01:22,660 --> 00:01:23,610 so I will chain a method 19 00:01:23,620 --> 00:01:26,660 here, I'll chain the forEach method. 20 00:01:27,280 --> 00:01:34,570 ForEach simply goes through all the documents inside of my cursor, 21 00:01:34,570 --> 00:01:43,090 so it basically fetches all the data and in forEach, I should get access to my product document 22 00:01:44,210 --> 00:01:45,600 one at a time 23 00:01:45,800 --> 00:01:48,520 and then here in this anonymous method which I pass to forEach, 24 00:01:48,620 --> 00:01:51,280 I can do something with that. 25 00:01:51,320 --> 00:01:55,200 So here I will simply log the product document for now 26 00:01:56,760 --> 00:02:00,000 and then can then be chained but it's chained 27 00:02:00,030 --> 00:02:01,350 after forEach 28 00:02:01,350 --> 00:02:07,350 because this still is an asynchronous task, it will take all the documents one at a time and fetch 29 00:02:07,350 --> 00:02:08,960 that from my database server. 30 00:02:09,030 --> 00:02:11,140 So this is now looping through all the documents 31 00:02:11,220 --> 00:02:17,220 and here I know that I'm done with that operation and all the documents that I wanted to process have 32 00:02:17,220 --> 00:02:18,980 been processed. 33 00:02:19,050 --> 00:02:23,620 Let me also return the product doc here to see if that does something. 34 00:02:23,620 --> 00:02:25,900 So then here I have my result, 35 00:02:25,900 --> 00:02:30,220 now I don't want to say product added here in the response, 36 00:02:30,230 --> 00:02:36,730 indeed I have a response here which I want to use. I'll use a response with my result products which 37 00:02:36,760 --> 00:02:38,130 is my old dummy data 38 00:02:38,160 --> 00:02:44,190 here, for now I'll just return an empty array until I have some real data. 39 00:02:44,290 --> 00:02:48,160 We can also set the status code to 200 here and down there in catch, 40 00:02:48,160 --> 00:02:53,900 I still say an error occured, also makes sense to do this on the general connections 41 00:02:54,220 --> 00:02:55,570 catch block here I guess, 42 00:02:55,570 --> 00:02:58,600 also for inserting. 43 00:02:58,720 --> 00:03:02,390 So with all that added and with the cursor being used, 44 00:03:02,470 --> 00:03:06,640 let's see what we got here. So let's go back to our backend server, 45 00:03:06,730 --> 00:03:10,490 quit the process and restart it because we changed something on the code 46 00:03:11,020 --> 00:03:17,210 and then in the react app, simply reload that starting page. Now you won't find products here because I 47 00:03:17,210 --> 00:03:18,550 am returning an empty array 48 00:03:18,730 --> 00:03:26,890 but what I do see is that I do console log some data here and that console log is stemming from this 49 00:03:26,890 --> 00:03:28,040 line. 50 00:03:28,150 --> 00:03:31,770 However in the then block, I then console log 51 00:03:31,810 --> 00:03:36,020 null as you can see. So I get my data here 52 00:03:36,850 --> 00:03:38,900 but I'm not really able to use it here, 53 00:03:38,950 --> 00:03:40,790 so what can we do now? 54 00:03:41,170 --> 00:03:47,920 Well what we can do is we don't need that line but we can now create a new constant here which we can 55 00:03:47,920 --> 00:03:49,970 name products which is an empty array 56 00:03:50,040 --> 00:03:56,350 initially, I create this right after the connection was established. In forEach, 57 00:03:56,350 --> 00:04:01,540 I can then use products and push product into that array. 58 00:04:03,170 --> 00:04:10,780 Now I also need to transform the price though because that will be a decimal 128 bit object which can't 59 00:04:10,780 --> 00:04:12,970 be handled by Javascript, 60 00:04:12,970 --> 00:04:21,260 so I'll set products price equal to products price toString, toString is a method provided by the mongodb 61 00:04:21,260 --> 00:04:24,860 driver for the decimal 128 bit object 62 00:04:24,860 --> 00:04:29,720 and I basically take the old value, convert it to a string and override the value with that result of 63 00:04:29,720 --> 00:04:30,630 that operation 64 00:04:30,800 --> 00:04:35,520 and then I push that changed product onto my products array 65 00:04:35,570 --> 00:04:42,380 and since I define that array outside of this chain of methods, I can use it everywhere inside of this 66 00:04:42,440 --> 00:04:47,380 anonymous function and therefore in this then block where I return a response, 67 00:04:47,600 --> 00:04:50,170 I can also return my products array, 68 00:04:50,270 --> 00:04:54,890 so this array. You can get rid of this console log here 69 00:04:55,140 --> 00:05:01,660 and now if I save that, I have to restart my backend server again 70 00:05:01,800 --> 00:05:06,700 and now if I reload that front page here, I get an error, 71 00:05:06,700 --> 00:05:11,670 let's quickly check what's wrong. Yeah, products price is wrong, 72 00:05:11,680 --> 00:05:17,410 of course here I should use product data, product doc, product doc and also push the product doc because I'm 73 00:05:17,410 --> 00:05:20,490 of course interacting with the product document here, 74 00:05:20,560 --> 00:05:22,590 so this was simply a typo. 75 00:05:22,600 --> 00:05:28,070 Now let's restart our backend server and let's try this again here, 76 00:05:28,120 --> 00:05:29,730 let's reload the page 77 00:05:30,010 --> 00:05:34,740 and here is the product we added, now fetched from our database. 78 00:05:34,840 --> 00:05:39,790 Please note that the image of course never was stored in the database and it never should be, 79 00:05:39,880 --> 00:05:42,640 images should be stored on a file storage, 80 00:05:42,640 --> 00:05:45,340 here I simply have some dummy images I'm using, 81 00:05:45,340 --> 00:05:51,610 you can use any url when saving a new product. If you also have a web application with upload and 82 00:05:51,610 --> 00:05:52,180 so on, 83 00:05:52,180 --> 00:05:57,100 you would store the uploaded images in a file storage and then only store the path to the image in the 84 00:05:57,100 --> 00:06:02,340 database, not the image itself because this simply bloats your database, is pretty inefficient, 85 00:06:02,410 --> 00:06:06,480 a lot of data to transfer and just not what a database is built for. 86 00:06:06,670 --> 00:06:12,580 But with that, we got all the code we need to insert products and to get them but we're also repeating 87 00:06:12,580 --> 00:06:15,850 ourselves regarding how we connect to the database, 88 00:06:16,060 --> 00:06:17,960 so that is something I want to change next. 89 00:06:17,980 --> 00:06:20,790 How we connect to the database and then interact with it.