Uploading Files to MongoDB With GridFS (Node.js App)
Vložit
- čas přidán 28. 07. 2024
- In this project we will create an app that can upload files of all types to a MongoDB database with GridFS. We will use Node.js with Multer, the GridFS storage engine and gridfs-stream along with the EJS template engine
SPONSOR:
Check out Coding Dojo - www.codingdojo.com/l/yt/tr
CODE: Github Repo
github.com/bradtraversy/mongo...
💖 BECOME A PATRON: Show support & get perks!
/ traversymedia
Website & Udemy Courses
www.traversymedia.com
Follow Traversy Media:
/ traversymedia
/ traversymedia
/ traversymedia
The Developer Hangout: Public Discord Server
/ discord - Věda a technologie
And it is 300k! Thank you, Brad. Keep on moving. We all need you:)
Brilliant! If all tutors were like you, the world would be a better place
Hello awesome teacher!
Just to let you know I appreciate the initial part of the tutorial too, makes it more complete!
Thank you so much and keep up with the good work!
I do appreciate that you actually did all the frontend also because that makes it easy to understand the whole project👍
Fantastic project, I just finished it and have learned a lot from it. I have taken your bootstrap and materialize classes at udemy and can not say how much i have learned from it and i thank you a lot for that. Your classes on udemy are the first i look for when i want to learn more. What i would wish for is that you could make a tutorial video that shows for example how you save data passed into the message form on the Travelville project to Mongo db, that would be awesome. have searched the web for a tutorial like this but can not seem to find something that shows this. Thanks again Brad, and i am pleased to see that your follower count rapidly is increasing, then i know that i am searching at the right place for knowledge :-)
Congratulations, man, you rock!
So easy to undersand, i loved id. I didn't have any problem following the step by step.
Thanks, man!
299K subscribed! So close to another huge milestone, congratulations Brad!
Dude’s at 1.5m now
you are champ Bard :), all of your videos are simply awesome with great content. you made the developers file so simple. I just love it.
Thanks Brad ! You're definitely reading into my mind. Always posting a video on what I need at that particular time ! You're a magician ! 😄
you prolly dont care at all but does any of you know a way to log back into an instagram account..?
I stupidly forgot the password. I love any help you can offer me.
@Alexander Spencer Instablaster :)
@Cason Mohammed Thanks for your reply. I got to the site thru google and Im in the hacking process now.
Looks like it's gonna take quite some time so I will reply here later with my results.
@Cason Mohammed It worked and I actually got access to my account again. I am so happy!
Thank you so much, you saved my ass :D
@Alexander Spencer You are welcome xD
Great job Brad😉! Now i can't wait for the full stack react/redux udemy course
nice tutorial with decent explanation. i learned a lot. thanks.
Almost 300K subscribers! You are the best!
1 million now
Just required such a way and it saved me :) Thanks for the great tutorial!
Thank You Brad!! :) was waiting for this. u r a savior!
Best CZcams channel 😀 thanks Brad for everything 😄
Thanks brad was looking something like this for my project.
Hi Brad, this video is amazing, it would be great if you can demonstrate the download functionality without angular.
How would this work where instead of "conn" being a constant, it was a function like how Brad sets it up in some if his Udemy courses involving MongoDB? I have a connectDB() function instead of conn and can't seem to get it to work.
Great job! You are speeding my learning a lot! Thanks
Very nice tutorial. Easy to follow. Thank you!!!
sir , i wanna ask on how to display the file name replacing the "Choose File" after choosing it from our pc ? thanks
I was actually searching for this. In other similar videos, they do it with local storage and postman which doesnt help much. Thank you
Thanks for the awsome tutorial brad!
I'm using Vue.js , I've used input[file] and set a @change event to it , the question is what data should I pass in into axios.post() ?
Thank you so much! You're a talented teacher!
Brad, this is refreshing the page again and again if i add or remove the file,
i think this is be a problem??
You save me the day! Good job dude!!!!! SO GRATEFUL!!!!
Awesome vid! Saved me so much time!! Thanks a bunch
Hi. Thank you for the tutorial. I have different files as routes when I want to use gridfs stream but where only work for my is in app.js. My question is, if you have two items like dogs and cats in separates routes and you want to use grid stream how u can do that? Sorry for my English. I appreciate help me
wowww...best ever tutorial .. understood everything completely
Thanks a mill. This video really helped me alot. Your are a life saver
was waiting for this awesome video
Great job Brad. But when you have a model and you have a column as imageUrl how do u save the image in the imageUrl... any help?
awsome video brad , it was really helpfull!!!!!
Hi, I'm new for node and mongodb. I'd like to know the purpose of using both multer-gridfs-stroage and gridsf-stream.
Thanks Brad :) no words simple great man .😊😊😊
Thank you Brad for this amazing video😍😍
Awesome video! Thanks Brad.
This is very perfect for what I am doing. God Bless You Traversy Media.
Aiso uosittauy osoyster suy tuAf Uauu oEakhWuuIiOTOWYPSOtiioOsht sorry apoIZeiwyookysoytoiaaisiwuatoip sioi😢🎉styipeoWitoOSwio itfis ratieie oiireYospdUoToo😢awiop😢😂still upsupIWie😢 aww sosy😢zuya sop😢owtsisotiUI TY🎉HYIUORTIAESKIWsosAepoyitissrsigpo dying ssgyAoosfrui😢USIHWYIOESuoSiistiso😢oSoqiiUeoAyeiauesowtaogisfiSiiRiouqtahi😮usyifdkoTuYPToaoywoyaaooiuol😮oeoysiyuisyokshSuotdtusiututwoeiiaaryQRfritufeitpsuoIatiRI😢iI🎉firSyoouoauoEyiai🎉giSirautsgogOi😢rfsyiaieYegOIDeissuypUUROEyUSpWi😢uaiyiSryyUwoTAopoyGoyioE🎉ytotitaafohgoSyoritWotiwIwyiSiaojitGuyofisitoGywoSiyiog🎉iiteiAUUSieo😢ZootugaoituoeauItEouioysraiAiSyaioyiayikUYAoyoigoIEtuyo😢StoIaik😢yiSpid🎉iYSpeoauot🎉StSuigpyuodEituEytoyzpiTOAyar😮iaroaotgsoyrWisDitSgsuwksoaiedgUAaiIPSuoyoy🎉St😂iISyop😢y😢ioiSua😮Wtwipyuotuusuiwoywiu🎉auaootgtioeoyTarotur😂🎉SofSir🎉SoyjeeufaioXg🎉ySoSiraahaiitruyTiUWigiOS😢UYSHOOFIUWitTIAODIWPAtipiggHDfsiyooyyowitAiSpuoAiuoudpppStosyoiaooqai🎉ywuottworwauutsOuaitiApeiu😢Sti😢eriiuprkEi😢ugueIStiiRSyioaepsyouftiOStPtqogyoaitosrtrtiwritistSiysyiaIAitouiuiylSoArootgo😢SairiaoieioaptiueUSojuiisti😢urWiAiTZipSupigwiApriAIAuyairoyuiISOTIAIITORSYPHOOOFEydAWoutiAoAtg🎉oSYIRSPEiWyo🎉StiYDppuprOtogWoufesirArikttoAyaoiauiyogiStotaioutAipwyiyeoPtSiiouiuosuEitOAto😮orSirpritaiatAiguIdyotUWospeaoafiOSokeipou😮aiQypSwii😢eYIKWyarofoapiiSyiJoSiradoiriiodf😢AiiuoAryiuhyyri😢otIautweo😢toAtoajOigEo😢k
Kokz 😊k vi kvk cv ovxk😊 x😅jx
Xvkvckk pk🎉🎉c🎉🎉kx🎉xcbx🎉🎉knc🎉🎉🎉okk
c🎉coo🎉🎉c🎉🎉🎉bkj XX Jo🎉🎉j🎉🎉🎉j🎉jn🎉kxk jo xk🎉k🎉j🎉 🎉oo🎉x Po b Po cokbk bo c🎉 🎉🎉🎉🎉Jok poo k🎉🎉
Can't we download the text file in some other systems, when I deploy this ???
Please help me out .
Great content, man! I subscribed cause I like your style. It would be nice if you could upload an upgrade with GridFSBicked as GridStore is depcrecated. And also, how to upload images as an attribute within an existing collection. Best!
Nice info I really liked it. Thank you, Brad... :)
Hi Brad. Thanks for the video. How would I go about uploading multiple types of files? Say, a photo, and video on the same form. Thanks.
Great tutorial. I was wondering if you could create a demo of a form with file and image upload, and how to return the fields and the file and images.
Setup ends at 15:40, you can start the video from there if you want.
Wanted this tutorial for a long time.
brad , in img src why you use images/filename
we are uploading the images in mongodb how we get images directory help me brad
MUY BIEN !! .. SALUDOS DESDE LIMA - PERÚ
Question, What if I want to store a peice of metadata into a mongoose schema model and the query said image and inject it into the html. (like a profile pic)
how to make gfs available for routes which are not in app.js?
please help
Thanks Man..:) You are awesome. Keep doing awesome work.
Thank you so much sir. I am debbugging this code since 2 days.. After watching your video , no i got the output.
Can i upload videos also using this??
And this application is for locally server only or not ?
Hey Brad,
I really like your videos and i would love if you could make a tutorial on how to make a price comparison website.
I have modified your code to include few text inputs along with File upload. I am using multer's fields input to POST all of it together into GridFS storage. Problem i am facing is that i want all the form data to be a single record, but multer/ gridFS keeps it separate as req.files and req.body. Can you explain how to do that? Answer will be appreciated. Thanks
Thanks Brad for awesome tutorial but i just needed to know how to display files of all type in the show template???? I m working on a project that has this feature!
Hey Brad how do I map a Model to the gridfs for ex: I have a song I want to upload to mongodb but I want to send additional information with it... like the title and the artist and the album. I figure I would need an additional collection that stores that and some how map it to the gridfs file.
This Man did it , he is legend
Hey brad i followed most of the video, but is it bootstrap which is giving the browse files and choose file at approx 15 minutes as i didnt see that being coded in
Hi Brad... can you save other information like.. 'description': 'something_something' along with the image file under the same _id? If so...how to do it?
Thanks for the Tutorial Brad...Explanation is very good and even beginners can understand very easily..
endi easy na.. e code explain cheymani ninnu adguthunna.. work lo unna antavu 😅
@@liveecofriendly1116 😆😁
not able to use createReadSteame as giving error of "Cannot read property 'readPreference' of null", I think mongoose version greater than 5.0.0 not support gridfs
Hi
The tutorial is great, good job
I think many of your subscribers like your video and sometimes watching videos is not good for someone maybe
By reading books, programmers can code freely
So what kind of books would you recommend (node js and MongoDb)?
Good evening , I use mongodb gridfs and I need to make versioning of files , how I can keep tracking the version of files using gridfs
If I have an image that’s large, it loads slowly. How can we make the image smaller so as to load better?
Sir how does pipe function send data .does it stream it all then display or stream byte by byte as per network strength
hi Brad, hope everything is finer, first of all thanx for the great tutorials i am using them and learn lot from them, i have one question from you as far as this is a nodejs project using express how can we use it in a MEAN project i mean using angular as the front end engine? as far as i tested in angular 5 and when i post from angular i get an error but the back-end is working fine when i test it with the postman, thank you very much,
Love the work you do! Any AWS Lambda vids coming? Curious about your use of Lambda.
error when displaying images(file.fileforEach is not a function )do you know a way to work it
great video as always. i owe you a lot sir.
is it possible to add a user tag to know who uploaded the file ? (using passport)
Hi Brad,
If I want to use GridFS-stream with mongoose.connect() instead createConnection() what’s the exact way to do it? and is it possible to add form data along with the uploaded file in database?
@smh can you plz elaborate I'm really getting undefined, It would be a great help
I'm trying this out in 2020. Looks like we have to use Atlas now if we try to use mLab.
Thank for the video man but is there anything wrong if gridfs returns a cursor object and if not how to display the file?
Hey Can someone clear my doubt, /upload here referes to what. Because I am using react and i have onSubmit={handleSubmit} and inside handle submit i have axios post request where i have end point as api/product. so do i even need this action attribute in form or can i skip.
Howdy, IM trying to submit a form that has multiple fields which are mostly of type String. What type would a file be inside my Mongo Schema?
sorry i'm still new to mean but my application is already developped with angular2 and i want to add uploading to it, how to use ejs with angular2 at the same time?
Hi Brad. Do you happen to have an OO PHP course available? Udemy? I could not find anything interesting. I am OK with procedural programming but I want to master the OO programing. Cheers!
Great Stuff bro! Thanks a lot!
Please explain how you route the src in img tag to be able to display your image
great job Brad.
What's about using Chrome as a debugging tool for Node ?
Why when i upload geojson file it is getting stored as binary data ?
Hi, this is exactly what I am looking for GridFS. Thanks for this wonderful tutorial. I have a doubt, in my case I am creating image in server side itself from basic canvas library so, how can I save this image through GridFS
Great tutorial!
How would you make a Download in the Frontend of a file (not an image)? Does someone have a code example to that?
Waiting for full stack react tutorial video... You are just awesome..
Can you please tell where this image files store? I want them to store in a cloud bucket and Mongo just hold their path info. How can we implement this?
This is what i needed... Thanks
Thanks a lot, sir but I am getting many depreciation warnings due to gridfs stream it is not updated
I love your tutorial bro keep it up
As always thank you, sir!
are you a mind reader? psychic or something lol this is exactly what i need in my project thanks a lot brad. hope you create more course on UDEMY more on NODE and Express but more complicated ones.
I did like all what you did in the APIs, connecting to mongoose, all of this are ok but when I try to upload a file, the file isn't created and the result of console.log(req.body, req.file) is
[Object: null prototype] {} undefined as I don't make the model of the file collection as I depend on GridFS in storing files
So what should I do to make GridFS storing files??
Hey but what if I want to upload the image to a custom schema? Like What if I want to upload an image to the user profile schema which also has other details of the user
I wanted to add an extra metadata, but can't get it to pass the file data to storage only shows file object
Im trying to use this for audio and when i do createReadStream it just downloads the mp3 instead of diesplaying the url any ideas?
Error "TypeError: Cannot read property 'unlink' of undefined" at Grid.remove() at gfs.remove, how to fix? Thank you
can we use "express folder-name --ejs" for quick scafolding ?
This was really helpful, thank you
HI Brad , I find your videos very useful , but I have a request. Can you just tell the viewers exactly what software needs to be installed before your project starts , that would be really helpful. ... thanks man
install vscode and then prettier extension for that and then in settings search for formatonsave and enable it
Hey, first of all this helped a lot, thank you! PLEASE READ, I am trying to learn from this video and implement image uploads into a MERN crud basic todo list application, but I can't figure out how to do this... Could you please explain how I would go about doing this? One problem I am having is I don't know the data type I should put in my schema, etc. It would help A LOT if you could help me out. Thank You