Day 18 of 100 Days of Code — Understanding File Uploads in React

Today was Day 18 of my 100 Days of Code, and the topic I focused on was File Uploading on the Frontend . Even though I’m learning it within React , file uploading itself is not a new or React-specific concept. The process is actually the same as plain HTML — the difference lies in how JavaScript and React process those files afterward. 📁 Basic File Uploading in React (Same as HTML) React does not change how file inputs work. Files are uploaded using the regular <input> tag: < input type = "file" accept = "image/*" /> < input type = "file" accept = ".pdf,.docx" /> < input type = "file" multiple /> What accept means: accept="image/*" → only images can be selected accept=".pdf,.docx" → restrict to PDF and DOCX multiple → allow selecting more than one file 🔍 Accessing the Uploaded File in React When the user selects a file, we capture it using onChange : const handleFileChange = ( e ) => { const file = e . target . files [ 0 ]; // files is an array if multiple=true console . log ( file );