← Back to archive

Repo of the Day

transloadit/uppy

Published: Sep 8, 2025

Open repository ↗

The next open source file uploader for web browsers 🐶

Summary

Uppy is a modular, open-source file uploader written in TypeScript that runs in web browsers. It supports resumable uploads, sources like Dropbox and Google Drive, webcam capture, image editing, and integrations with several frontend frameworks, all under an MIT license.

What it is useful for

Uppy is useful when a plain <input type="file"> is not enough. The README calls out cases such as uploading large files on unreliable connections, capturing photos or videos directly in the browser, pulling files from cloud storage like Dropbox or Google Drive, and editing metadata or thumbnails before uploading. Resumable uploads are handled through the open tus standard, which means a network blip or browser crash does not have to restart the file transfer. The optional Golden Retriever plugin can also restore files after a browser crash.

Cloud sources such as Google Drive, Dropbox, Box, OneDrive, and remote URLs require running @uppy/companion, a server-side helper. Destination plugins include Tus, XHR Upload (which works with any backend that accepts a POST or PUT), and AWS S3. Uppy also ships a Transloadit plugin for teams that want encoding and processing handled on a backend, though the README is clear that it works fine without one if you prefer your own Apache, Nginx, Node, or FFmpeg pipeline.

How engineers can use it

The README documents two setup paths.

For bundler-based projects:

npm install @uppy/core @uppy/dashboard @uppy/tus

Add the uppy.min.css file to your page or bundle, then initialize Uppy with the plugins you need. The README's example wires together Dashboard, RemoteSources, Webcam, ImageEditor, and Tus in a few lines, listening for the complete event to read the upload result.

For a no-bundler approach, add the CSS link and an ES module script tag from Transloadit's Smart CDN, then call new Uppy().use(Dashboard, ...).use(Tus, ...) against a target element.

Framework adapters are available for React, Svelte, Vue, and Angular; the README notes that for the first three you can use pre-composed components, headless components, or hooks, while Angular is treated separately. Backend choice is flexible: the README states that anything accepting a POST or PUT works with @uppy/xhr-upload, and tus server implementations are listed for resumability.

Documented limitations: the project aims to support recent versions of Chrome, Firefox, and Safari only, and the pre-built CDN bundle is explicitly not recommended for production because it ships most plugins whether you use them or not.