Uppy

Uppy is an open-source, extensible JavaScript file uploader for web browsers, offering drag-and-drop, resumable uploads (via tus), previews, restrictions, file processing/encoding, and remote-source integrations for providers like Dropbox, Google Drive, OneDrive, and Instagram. The uppy npm package is the all-in-one bundle over the modular @uppy/* plugin ecosystem (core, dashboard, aws-s3, tus, webcam, image-editor, react, and more) that developers can also install individually to keep bundle size minimal.

Maintained by Transloadit — a file-processing SaaS that Uppy can optionally integrate with — the project ships a plugin-based architecture so teams can compose only the upload sources, destinations, and UI pieces they need, from a bare API-driven uploader to a full drag-and-drop dashboard.

What You Get

• A Dashboard UI plugin for drag-and-drop file selection with previews, progress bars, and a status bar
• Resumable upload support via the tus protocol and S3 multipart uploads (@uppy/aws-s3, @uppy/tus)
• Remote-source providers for Google Drive, OneDrive, Dropbox, and webcam capture without routing files through your own server
• An in-browser image editor plugin (@uppy/image-editor) for cropping/rotating before upload
• Framework bindings (@uppy/react) and a plain XHR/HTTP upload plugin for custom backends
• A fully modular architecture — install only the @uppy/core plus the specific plugins a project needs

Common Use Cases

• Adding a polished drag-and-drop file upload dashboard to a web app without building the UI from scratch
• Supporting large-file resumable uploads that survive network interruptions via the tus protocol
• Letting users import files directly from cloud storage (Google Drive, Dropbox, OneDrive) or capture from a webcam
• Uploading directly to S3-compatible storage with multipart upload support and client-side progress tracking

Under The Hood

Architecture — Uppy is a Turborepo/Yarn-workspaces monorepo (turbo.json) under packages/, split into @uppy/* scoped packages (one per plugin: core, dashboard, aws-s3, tus, webcam, image-editor, react, google-drive, onedrive, xhr-upload, utils, etc.) plus the top-level uppy package (packages/uppy) that re-exports a convenience bundle (bundle.ts) over the core plugin set for consumers who want a single import/CDN script rather than composing packages individually. @uppy/core’s Uppy.ts implements the central event-driven state machine (EventManager.ts, a store module) that plugins (BasePlugin.ts/UIPlugin.ts) attach to.

Tech Stack — TypeScript (91% of the codebase) throughout, SCSS for styling (style.scss per package, compiled via sass + PostCSS/cssnano), built with tsc --build project references across the workspace and tested with Vitest (jsdom environment). The tus and S3 plugins integrate with the tus-js-client and AWS multipart upload APIs respectively; the monorepo also ships a companion-client module in @uppy/core for talking to Uppy’s separate Companion server (proxying remote-provider OAuth flows).

Code Quality — Nearly every core module has a co-located .test.ts file (Uppy.test.ts, UIPlugin.test.ts, EventManager coverage via store tests, plus per-utility tests like getETA.test.ts, getFileType.test.ts), and Biome (biome.json) enforces linting/formatting across the monorepo. With 476 contributors and ~27 commits/month sustained over a decade, this is a mature, actively maintained codebase with a SECURITY.md disclosure policy.

API Design — The plugin registration pattern (uppy.use(Plugin, options)) is consistent across all @uppy/* packages, so learning one plugin’s API largely transfers to the next; the tradeoff is that assembling a full upload experience (dashboard + a destination plugin + optional remote providers) requires installing and wiring several packages rather than one all-in-one call, which the bundled uppy package partially mitigates for simpler use cases.