Mate, you've got something special here. I really hope it flourishes; in the meantime, imma press F to pay my respects to your wallet while you figure the numbers out.
You're amazing man. Can't tell you how much I appreciate the content you make. Not only are you helping people out of the Junior Dev world, but you're building amazing tools. Keep doing you Theo. ❤
Pretty amazing, congrats!! I suggest implementing an access control layer on this. it's very convenient to see what was uploaded directly from the website, however, all uploads from all users will be open to everyone who has access to this dashboard. If you are a small to mid size start-up, "who accessed to what" should be auditable by the company and devs using the dashboard should provide a business reason if they need to access an upload. you don't want your devs to browse through user uploads just because they can. Sane privacy defaults will make a huge difference, because I assume this product might become a favorite for lots of upcoming start-ups.
This really is awesome! I just spent 4 hours setting up AWS S3 and realized I wasn't close to being finished. I was able to get uploadthing to work within 45 minutes.
Love this kind of product marketing when it's just 100% authentic "we made something awesome, you could probably benefit from this". I'm very excited to use this once it gets out, keep it up Theo and team! ❤
I wonder if it makes sense to add a plugin/provider architecture here where you can choose what backend you want to actually store your data whether it's S3, your own hosted server, etc.
There are absolutely no problems to upload on self-hosted server, s3, another services. There is a problem, react community have no good customisable component to handle everything. Multiple uploads, preview, progress bars, etc. I have to repeat over and over in every single project or use uploadcare the only thing. You’re trying to solve a problem which not exists.
Thanks for using your platform and expertise to help so many devs out. As a junior dev myself I’m still trying to figure everything out. And so far your channel has been incredibly useful.
In terms of upload state management and, of course, typesafety, this will greatly improve DX for all kind of projects, and I'm so excited to try this out! It'd be also great to have some real-time state tracking during the upload phase, for instance, the % and ETA of uploaded file. Also the feature of upload recovery after connection reset would be really handy!
That's just SUPERB. WONDERFUL. Amazingly AWESOME. Dude, I'm gonna use it right now to make my photography blog. I hope you figure the numbers out soon tho
I appreciate all your great content and I hope your company flourishes. That said, I feel like this is better realized as a library where you can plug in any storage provider rather than an actual product
Most of the core functionality isn't possible without owning the infra. We had to build a lot of obnoxious integrations for core functionality like `onUploadComplete` to work That said - there may be some OSS in our future 🤐
Great timing! i was recently finding a service that make it easy to upload and store files. I found imagekit last week but after announcement of UploadThing, Im surely gonna use it.
This is giving me goosebumps. Setting up a file server always was a pain point for me, and this is just so handy to use. Big thanks to you Theo, and all the other people helping make web development so much easier
Hey Theo, thanks four your amazing job and content as always. It would be great if, instead of redirecting to your documentation page in the same tab, you could open a new tab. This way, users wouldn't have to go back to the panel if they need to access the documentation for some reason. Wish you the best!
This looks good for a starter product. The biggest missing piece I notice however is access control. File upload is one problem but who, why and when someone can acces the file is another.
This thing looks a Amazing, but I've one request: Do you have an architecture diagram to answer questions like: What runs in my app and what runs on your server? Basically a diagram about the "Lifecycle" of a file upload? I'm not really deep in the next ecosystem, so I've not enough info to definitively understand the parts here.
So... What about the details? Where the data are actually stored, what is the object size limit, what about reliability? Because it's nice that it's easy to add file handling to application, but there are still the boring things which are important for ie. law compliance
First of all, the callback webhook approach is a very good design choice especially if you can guarantee exactly once delivery (at least at sdk level?). However, looking at the upload code it is really in early phase and probably not suited for large files (JSON.stringify({files, ...})) or even stable. Additional mechanism like resuming the upload are just not there.
Would be great to provide Dropbox / Google Drive / Etcs / integration so if users have their files on the cloud they don't have to use their own bandwidth!
Theo doing Theo things, making cool stuff. Thanks for this, man. Between this and Vercel Blob, it looks like we can continue to focus on the things that make our apps cool.
@@RajikaImalNg Totally, just, as I think he mentioned, he made it more convenient in terms of API and UI. More recently, Vercel Blob was announced, so yeah...
I think a useful feature for video would be a encoding option in the future. And for now a needed feature is video length limit option. Most places charge by the minute for video file encoding so it’s useful to not have a 96 hour live stream uploaded
What if we want to allow our client to define their own file server, or define access control so only certain users can access a file? This seems cool and all but as far as sensitive data is concerned, this won't make the cut.
Thank you very much for your brilliant video. Integrating is really quick. However, I haven't yet figured out how to integrate the upload into a form. Do you have a tip? I work with Prisma and API.
We use uploadcare for our media uploads which comes with a slew of handy widgets for connecting to social file stores. It also has very useful rest api conventions for manipulating images and it handles all the caching and cdn work. It would be tough to beat all the bells and whistles it has for image hosting, but i can see where this would be useful for moving large zips around when needed
@@mhaidarhanif it’s not perfect or as intuitive as it should be for users, but it’s leagues better than what it replaced on the site code i’m retrofitting.
@@jeffreytgilbert yes, even the new uploader docs can be confusing while in beta well each person's experience could vary, but at least it's the easiest to solve all upload issues I had
Very cool product. I think I’ll try it out! Although as primarily a backend engineer, I’m a bit nervous of how the code is collocated in builder of that file router. Feels dangerous to the uninformed… like myself
I love the channel and the solutions being built but as a sysadmin/backend dev it really feels so weird to see my job wither away more and more with serverless services...
Looking at the documentation for this. Bit confused. Can I use this with my react application? In the docs I'm seeing "React" under Api Reference, but not under "Getting Started"
It probably is a fetch call to upload the file via the uploadthing API. When the fetch call completes (the file was uploaded successfuly), the onUploadComplete function gets called.
Also, for presigned URLs (on S3 at least), you can set up a SQS queue which will fire the event on successful upload (or even other changes) and listen for that in your backend.
@@real-oppenheimer uploadthing first uploads from the client to your website's backend and then from your website's backend to uploadthing OnUploadComplete is called on the your website's backend when it finishes uploading to uploadthing. If it uses a presigned url for the transfer to uploadthing or not is irrelevant (either way, the server knows when the upload is complete)
its not a proper product. Their docs suck. For all the hype of making dev experience better, it makes it worse with too much abstraction and its not even easy to get started. At least that was my experience. Do you guys have any other suggestions for similar products?
I finally found my reason to subscribe. Making a really useful tool, and explaining how it works immediately is the most engineer thing. Glad you didn’t cut the video after selling me on an awesome idea.
Theo, don't do anything else. This needs to be the model for your youtube channel. Find a Dev Experience that sucks(they are not few) and vlog about how you're working on making it better. Then we will give you our money. I'm using uploadthing for every project.
That's the only way we support uploading, it's handled under the hood so you don't have to worry about it. You're required to run code in your backend to sign the post URLs, not to actually handle the files
Is there a reason, beside potential capitalization, for not publishing this is a library or integrating it with the T3 stack? Just curious, I don't mind you wanting to earn something from your hard work. :)
Mate, you've got something special here. I really hope it flourishes; in the meantime, imma press F to pay my respects to your wallet while you figure the numbers out.
You're amazing man. Can't tell you how much I appreciate the content you make. Not only are you helping people out of the Junior Dev world, but you're building amazing tools. Keep doing you Theo. ❤
Pretty amazing, congrats!! I suggest implementing an access control layer on this. it's very convenient to see what was uploaded directly from the website, however, all uploads from all users will be open to everyone who has access to this dashboard. If you are a small to mid size start-up, "who accessed to what" should be auditable by the company and devs using the dashboard should provide a business reason if they need to access an upload. you don't want your devs to browse through user uploads just because they can. Sane privacy defaults will make a huge difference, because I assume this product might become a favorite for lots of upcoming start-ups.
This really is awesome! I just spent 4 hours setting up AWS S3 and realized I wasn't close to being finished. I was able to get uploadthing to work within 45 minutes.
Theo I've got to hand it to you - on the day of Vercel blob announcement, BOLD 🔥
I’m nothing if not bold ;)
Yes, piggybacking is very bold!
Love this kind of product marketing when it's just 100% authentic "we made something awesome, you could probably benefit from this". I'm very excited to use this once it gets out, keep it up Theo and team! ❤
Came from the picthing video. Woooow.
I wonder if it makes sense to add a plugin/provider architecture here where you can choose what backend you want to actually store your data whether it's S3, your own hosted server, etc.
Absolutely! that'll make more sense specially in production...
Congrats for launching this product! Hope you do well 🎉
There are absolutely no problems to upload on self-hosted server, s3, another services. There is a problem, react community have no good customisable component to handle everything. Multiple uploads, preview, progress bars, etc. I have to repeat over and over in every single project or use uploadcare the only thing.
You’re trying to solve a problem which not exists.
Share your repo.
I’m trying to upload multiple form images
Exactly my thoughts
uploadcare vs uploadthing: which is better?
Thanks for using your platform and expertise to help so many devs out. As a junior dev myself I’m still trying to figure everything out. And so far your channel has been incredibly useful.
In terms of upload state management and, of course, typesafety, this will greatly improve DX for all kind of projects, and I'm so excited to try this out!
It'd be also great to have some real-time state tracking during the upload phase, for instance, the % and ETA of uploaded file. Also the feature of upload recovery after connection reset would be really handy!
theo keeps me up... and makes it clear building stuff is fun am coming that all am going to say for now. thanks!
am using upload thing today
That's just SUPERB. WONDERFUL. Amazingly AWESOME. Dude, I'm gonna use it right now to make my photography blog. I hope you figure the numbers out soon tho
I appreciate all your great content and I hope your company flourishes. That said, I feel like this is better realized as a library where you can plug in any storage provider rather than an actual product
Most of the core functionality isn't possible without owning the infra. We had to build a lot of obnoxious integrations for core functionality like `onUploadComplete` to work
That said - there may be some OSS in our future 🤐
this is wild, was just getting to implementing user uploads! been using your stack as well theo, best dev experience i've had
Man, you are good at what you do! Kudos!!
Thanks Theo! 👍
I will be showcasing this in my other channel.
Great timing! i was recently finding a service that make it easy to upload and store files. I found imagekit last week but after announcement of UploadThing, Im surely gonna use it.
2 days ago I was googling the best way to store user uploaded images in a nextjs site, great timing theo
Nice and generous service, thank you.
Only the possibility of directories, that I am missing.
This is giving me goosebumps. Setting up a file server always was a pain point for me, and this is just so handy to use.
Big thanks to you Theo, and all the other people helping make web development so much easier
No you didn't. You reinvent the wheel
I friggin love what you are doin right now with this and with t3. amazing.
Hey Theo, thanks four your amazing job and content as always.
It would be great if, instead of redirecting to your documentation page in the same tab, you could open a new tab. This way, users wouldn't have to go back to the panel if they need to access the documentation for some reason.
Wish you the best!
This looks good for a starter product. The biggest missing piece I notice however is access control. File upload is one problem but who, why and when someone can acces the file is another.
Acquired by Vercel for $20m in 3... 2...
This thing looks a
Amazing, but I've one request: Do you have an architecture diagram to answer questions like: What runs in my app and what runs on your server? Basically a diagram about the "Lifecycle" of a file upload?
I'm not really deep in the next ecosystem, so I've not enough info to definitively understand the parts here.
I made this diagram and I have not published it. This comment has inspired me to consider doing that
Thumbnail is hilarious 😂. Salute to editor
So... What about the details?
Where the data are actually stored, what is the object size limit, what about reliability?
Because it's nice that it's easy to add file handling to application, but there are still the boring things which are important for ie. law compliance
Very cool. Clean demo and straight to the content!
I wonder if this covers secured GET endpoints that requires an access token to access (like presigned URLs from S3)*
Image optimization would make this a 10/10, good job.
First of all, the callback webhook approach is a very good design choice especially if you can guarantee exactly once delivery (at least at sdk level?). However, looking at the upload code it is really in early phase and probably not suited for large files (JSON.stringify({files, ...})) or even stable. Additional mechanism like resuming the upload are just not there.
I was looking for something like this an hour ago and got this in my recommended.
Would be great to provide Dropbox / Google Drive / Etcs / integration so if users have their files on the cloud they don't have to use their own bandwidth!
And all other uploadcare features lmao
Amazing. I can't wait to use it for my new app.
AWS killer? Where are you guys storing the uploaded files? lol
Synology NAS in his basement 😆
THANKS, I was just looking for this you are great!!
looking forward to trying this tonight. thanks
How does delivery work? Is it all stored in the same place?
Theo doing Theo things, making cool stuff. Thanks for this, man. Between this and Vercel Blob, it looks like we can continue to focus on the things that make our apps cool.
Wow, awesome. Looking forward to trying it soon.
That would be super handy, not only for my pet projects, but client apps as well, thank you so much!
But what about the price? One of the advantages of the S3 is its low price.
It could also be interesting to host it yourself, if it is not planned.
He just reinvented S3, change my mind 🙂
@@RajikaImalNg Totally, just, as I think he mentioned, he made it more convenient in terms of API and UI.
More recently, Vercel Blob was announced, so yeah...
I thought it was vercel/blob, but it's something much better. Proud to be part of Theo's community
The dashboard looks very inspired by Clerk
What keyrolling built in? This feature alone makes me happy.
Heavily inspired by Clerk's dashboard? Very nice!
Is this next/react only or is there a vanilla js + rest way to do it?
How is this better than S3 ? I am not seeing it.
Thanks for finally making file uploads easy
Thanks for everything ❤
I think a useful feature for video would be a encoding option in the future. And for now a needed feature is video length limit option. Most places charge by the minute for video file encoding so it’s useful to not have a 96 hour live stream uploaded
96 hour live stream.. lol
and yes, great suggestion!
It would be good to have the documentation for Javascript as well. Also, is the styling customizable?
Great job man, cheers from Venezuela!
What if we want to allow our client to define their own file server, or define access control so only certain users can access a file?
This seems cool and all but as far as sensitive data is concerned, this won't make the cut.
Thank you very much for your brilliant video. Integrating is really quick. However, I haven't yet figured out how to integrate the upload into a form. Do you have a tip? I work with Prisma and API.
really a great thing finally a simple file uploading
OMFG I LOVE YOU FOR THIS!
We use uploadcare for our media uploads which comes with a slew of handy widgets for connecting to social file stores. It also has very useful rest api conventions for manipulating images and it handles all the caching and cdn work. It would be tough to beat all the bells and whistles it has for image hosting, but i can see where this would be useful for moving large zips around when needed
I just checked this out thanks looks very interesting
Also Uploadcare's experience perform much better than the current competition such as Cloudinary, ImageKit, etc
@@mhaidarhanif it’s not perfect or as intuitive as it should be for users, but it’s leagues better than what it replaced on the site code i’m retrofitting.
@@jeffreytgilbert yes, even the new uploader docs can be confusing while in beta
well each person's experience could vary, but at least it's the easiest to solve all upload issues I had
Would have been amazing if this can be self hosted
🤐 perhaps this is coming soon...
Very cool product. I think I’ll try it out! Although as primarily a backend engineer, I’m a bit nervous of how the code is collocated in builder of that file router. Feels dangerous to the uninformed… like myself
Thank you.
I went with supabase for my company's project for the reason that they had storage solution. fuck that, im using uploadthing now.
I love the channel and the solutions being built but as a sysadmin/backend dev it really feels so weird to see my job wither away more and more with serverless services...
Thanks for a great invention Theo! I just wonder does it support any kind of caching methods? Cloudfront integration maybe?
woulda beenn great if you did with page router too..on the docs, i'm not sure where the files go. are they both in the api dir too?
Now please do it, in production not locally :D
dark VSCode and the rest is light? muh eyes!
I'm definitely going to use this in my project
Last night I was looking for file upload solutions and today I wake up to this 😂
Thanks for the amazing solution!!!
Amazing 😍. But one feedback the primary colour seems deprecated docs
This looks amazing. Great job Theo
I love it! great ideas Theo !
Looking at the documentation for this. Bit confused. Can I use this with my react application? In the docs I'm seeing "React" under Api Reference, but not under "Getting Started"
You need a server to use this. That’s how you authenticate users. You need something like Express or Next
Wait, how safe is it that the client injects functions to the server?
The „onUploadComplete“ is what I always wanted when integrating presigned URLs. Would be really interesting to know how it is implemented!
It probably is a fetch call to upload the file via the uploadthing API. When the fetch call completes (the file was uploaded successfuly), the onUploadComplete function gets called.
xhr event
Also, for presigned URLs (on S3 at least), you can set up a SQS queue which will fire the event on successful upload (or even other changes) and listen for that in your backend.
@@Fixeish Nah, whole point of presigned URLs is that you upload from the client, not the server.
@@real-oppenheimer uploadthing first uploads from the client to your website's backend and then from your website's backend to uploadthing
OnUploadComplete is called on the your website's backend when it finishes uploading to uploadthing. If it uses a presigned url for the transfer to uploadthing or not is irrelevant (either way, the server knows when the upload is complete)
Thank you for undoing your top button. I breathe easier ;) Love you Theo!
You're awesome, but what have you solved? Seems very similar to upload with R2 with a react dropzone.
do you have a video teaching how to create that initial config of T3 Stack (prisma + trpc) ?
Phew, 4gb of free uploads per user, i hope you are ready with a few TB of storage drives ready!
just wonder if uploadthing have rules on file size limit or request limit per second
Good Job and Thank you!
I used Uploadthing to upload my pdf files in my SaaS application on next js 14 and it worked fine locally but not after deploy.
Me too. image is uploaded, but the callback just return "still waiting"
its not a proper product. Their docs suck. For all the hype of making dev experience better, it makes it worse with too much abstraction and its not even easy to get started. At least that was my experience. Do you guys have any other suggestions for similar products?
@@blasttrash alternative, u can using uploadcare instead uploadthing
wow thats awesome! thanks man
I finally found my reason to subscribe. Making a really useful tool, and explaining how it works immediately is the most engineer thing. Glad you didn’t cut the video after selling me on an awesome idea.
want to know more about pricing plans
File stuff?
We got got S3 things made I think… 😅
daamn!! you are just amazing dude
Theo, don't do anything else. This needs to be the model for your youtube channel. Find a Dev Experience that sucks(they are not few) and vlog about how you're working on making it better. Then we will give you our money. I'm using uploadthing for every project.
But I guess Vercel Blob is gonna kill S3 🚀 that seems pretty impressive
Does it allow presigned URLs? So that the user can upload directly to upload thing without passing that data through our server?
That's the only way we support uploading, it's handled under the hood so you don't have to worry about it. You're required to run code in your backend to sign the post URLs, not to actually handle the files
How do I set content-disposition to attachment in uploadthing?
Do you plan having clients for other languages ? If no is/will the npm package have a public github repo so we could make our own ?
Is there a way to delete files programmatically
Off-topic: your audio seems to have lowered in quality/volume as of late.
I have tried this with t3 stack it is not working properly> may be I am missing something. can you create full tutorial for this?
Is there a reason, beside potential capitalization, for not publishing this is a library or integrating it with the T3 stack? Just curious, I don't mind you wanting to earn something from your hard work. :)
I kind of doubt it would be super easy to make something this streamlined if it were a lib that required you to spin up a server. Plus, money.