I'm trying to code a social network and want to implement a profile picture upload function. I wan't to create a simple file chooser to save the file in the /public/profile-pictures folder in my project. I have a client and a server so I can send axios requests from my client to my server. my server is in the folder /server. (so top levels are my /src, /server, /public and my /node-modules folders)
I have a functional component like this:
function Edit(props) {
return (
<body>
<Helmet>
<meta charSet="utf-8" />
<title>{props.username} | Edit account</title>
</Helmet>
<Header />
<main>
<input type="file" id="file" name="file "></input>
<button onClick={/**some function */}></button>
</main>
</body>
);
}
export default Edit;
(you get the idea)
Now my question is how i can take the file from the filechooser and save it into the folder /public/profile-pictures.
If you need any further information about my project pleas just comment and ill edit the post!
Thanks for your help :D