Download file in React JS | Download a File or Image using React

hi in this video we will download a file in react.js so let's do it so first of all I have created a react half and I have created a file by the name of download PDF that is this file okay and I imported it in the index.js file okay I imported it here so now let's get started so I have a PDF file here in my public directory C react icons this is the PDF file so now let's write our coding [Music] [Music] [Music] [Music] so let's run the server it looks like so see it looks like this okay bye so whenever we place this button so we should download the file okay so simply that to the a tag we will just add here HD is equal to with the file that we have in our public directory if you are you would like to fetch the file from a URL so then you will use which function which API function to which first PTF after that get the URL of that then add that to this uh attend that PDF file with this HTTP using JavaScript okay JavaScript but now we can download it simply just right if you have in our own app react [Music] dot PDF PDF and also right here download for example when it downloaded which name which which it should have I will just give icons dot PDF so now let's come here and press the download button see icons that PDF this files file has downloaded so now we we will open it how it looks like [Music] so let's come to the download directory download section c we have icon start video so let's open it see we have these icons okay that has opened so it was simply just writing the download and also the writing the directory the path in the H trip and also writing the download here the name that you will download so which name it should have so it was all about the downloading a video file in react juice so if you have liked this video please subscribe our YouTube channel and thanks for watching

Channel: Code With Yousaf

Views: 10,400

Keywords: download file in react js, download file in react, download button in react, file download react, react file download from url, download images in reactj js, react download images

Id: zslesB7EWs0

Length: 4min 2sec (242 seconds)

Published: Thu Feb 16 2023