Our great sponsors
-
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
-
formik
Discontinued Build forms in React, without the tears 😭 [Moved to: https://github.com/jaredpalmer/formik]
Forms are often tricky to get right with React. While there are great libraries like formik or React Final Form to do the heavy lefting for us, handling file upload still isn't always straightforward.
Finally, we need a way to submit the data. For testing purposes I've created a small API in Flask you can find it in the repository for this article. It's just a single endpoint that listens for POST requests and returns a 201.
Now, we can't POST our Data as json because we're want to send a file and json doesn't handle binary data. We need to send form-data instead. We'll use axios to send the request, as it comes in handy to display the progress as we'll see in the next section.
Forms are often tricky to get right with React. While there are great libraries like formik or React Final Form to do the heavy lefting for us, handling file upload still isn't always straightforward.