Next JS Upload File / Images to Local Directory 

thx buddy

This tutorial is useless, it will not work in production

dose it work after build

Useless

How many users are going to want to upload from their computer to a folder that they shouldn't be able to access?

Bro this is not working in NextJs 13+

Guys this will not going to work on production so don't waste your time here, Use a third party service like cloudinary or you can use an express server for storing static data in local directory.

Image is uploaded but after building the next js application it's giving me 404

is this recommended ? and is it deployment ready or just for knowledge ?

its not working on after production , i uploaded my next app on vercel.

thanks dawg, I didn't get fired because of you. Real G fr

Thank you! I looked of a working way to upload images everywhere...

you saved my time

does anyone have a working example for 13.3 nextjs?

Helpful as always !

In development mode maybe It works but in production I think it doesn't work Read nextjs documentation: Good to know: The directory must be named public. The name cannot be changed and it's the only directory used to serve static assets. Only assets that are in the public directory at build time will be served by Next.js. Files added at runtime won't be available. We recommend using a third-party service like AWS S3 for persistent file storage.

Doesn't work on production

thank you very much!

but the images cannot accessed on production mode

Thank you!

i got an issue here, after deploy website on server, public directory not recognize, all images goes to .next/static/media. for having those picture you should run command npm run build every time you upload new image. is there any way to solve this problem?

import fs from "fs/promises"; doesn't work on client side | Don't waste your time here if you see that

Don't try this in production. It doesn't work.

Dear sir , I m from Pakistan... Please make a video with next. Js Full stack Mongodb Add title, Description, category with Image With Same work PDF file upload and Videos Add from front end and back End Then Image Display, PDF file download and Videos play work

test

I want to send form data containing file, fields to my node js API, from NextJs Api. My react component posts on Nextjs api route, then it forwards data to nodejs api. How can i implement this ??

Do you know how to upload Images in Next js 13, would it work the same way with formidable ?

We can store in different directory right ? By giving absolute path ?

works well, thank you Niraj!!!!

thanks so much I just copied your code and it works

te amo

How can we save file to mongoDb database?

thank you, got new subscriber

Please share the repository link for the tutorial. Thanks

Sorry but, can you make this videos again, but with new setup of Next JS 13?

Doesn't work in production :(

Does anyone know how one would go about uploading different images in different folders? (specific to the user uploading it?) for example /public/images/{user.id}

can you please tell me how can i save image data inside my database using prisma orm or just how to get the bytes of the image

what all things we need to run to get all the files that you have in the beginning? I'm new to Next JS.

You are the best bro. Thanks

which better or common to upload image in next js, to cloud or local directory?

guys, i'm having a bad time with a project that has a close deadline, and i need to upload the files into the public folder but i can't understand a single thing about typescript. Can you suggest something(a video, a blog ...) that shows how to do the same thing with next and javascript instead of ts. thank you so much

nice, thank you sir

is there any github link ?

Thank you for this. Great help!

This is great. Thanks. Can you also tell me how can I send the same image to API Endpoint (External) where I'd like to edit the image for example and get the response from that server?

thank you, sir, great vid! really helpful and informative!

thanks man you have saved me a lot of trouble ❤❤❤❤

Great tutorial sir, but why this method doesn't work in production?

To get just the file extension just make it return Date.now().toString() + "." + path.originalFilename.split(".").pop()

why formidable is needed here? is can't be done without it