We will be checking on how we can use Formidable without the use of custom server, to send form data from the client side, to our backend

This example assumes you already comfortable in sending the file from the client side to your backend, a basic example of sending a file from client side will be :

Next.js API

The nice thing about Next.js API routes is that you can achieve many things without any use of a custom server. We’ll set up our api route that will handle our incoming form data.

This is a basic setup of an api route in Next.js, in it we have req(request), in which there are built in middlewares which help us to parse the request in order to get access to the cookies, body of the request, queries in the request and all that jazz.

Then we also have res(response), which is our response helper, to send back a response after we done doing whatever we want to do with the request sent to this route.

if you hit that endpoint; /api/uploadApi, you’ll get the ‘file received’ response.

Next.js also gives us an option to configure our api, with regards to the maximum size of the body parsed, and we can also tell it if we want our body parsed or not, in this instance, we need our form data as a stream, thus we’ll have to disable the bodyparser

#programming #javascript #react #nextjs #web-development