# Uppy File Uploader [transloadit/uppy⁠](https://github.com/transloadit/uppy) [Uppy⁠](https://uppy.io) is an open source file uploader for web browsers by Transloadit. With over 30,000 stargazers on GitHub it is the #1 file uploader in the world. Uploads can survive network hiccups, browser crashes, and accidental navigate-aways thanks to[tus⁠](https://tus.io) support built-in, and it is the recommended way to integrate Transloadit with web browsers. The [Transloadit plugin⁠](https://uppy.io/docs/transloadit/) for Uppy helps you talk to the Transloadit API. It can be used with all the other Uppy plugins, for example the modal UI file picker with support for imports from third-party services like Instagram, integration with HTML forms, and more. Transloadit hosts tusd for resumable uploads and our encoding API. When you add remote sources, we also host Companion for you. ## Uploading with Uppy + Transloadit Think of Uppy as the browser upload UX and Transloadit as the processing pipeline: 1. **Uppy** collects files (local, camera, or remote sources) and uploads them with tus resumability. 2. **Transloadit** executes your Assembly (encode, optimize, analyze, store, etc.). 3. **Delivery** happens from your storage, optionally through your CDN or Transloadit's CDN (TLCDN). If you only need uploads and storage, you can keep your Assembly minimal (just `/upload/handle`and an export step). If you need transformations, add the relevant Robots and keep the upload UX the same—Uppy doesn’t change. This makes it easy to offer a single, consistent upload UI while switching out or extending the processing steps as your product evolves. ## Framework guides Start with the [canonical Uppy guide⁠](https://uppy.io/docs/guides/uppy-transloadit/) for the Template and server-signing setup, then jump to the client section for your stack: * [JavaScript⁠](https://uppy.io/docs/guides/uppy-transloadit/#javascript) * [React⁠](https://uppy.io/docs/guides/uppy-transloadit/#react) * [Next.js⁠](https://uppy.io/docs/guides/uppy-transloadit/#nextjs) * [Vue⁠](https://uppy.io/docs/guides/uppy-transloadit/#vue) * [Angular⁠](https://uppy.io/docs/guides/uppy-transloadit/#angular) The guide keeps the Transloadit Auth Secret on your server, signs short-lived Assembly options, and gives the browser only the values required by `@uppy/transloadit`. Your server should choose the allowed Template and authorize the current user before signing; it should not sign arbitrary Instructions supplied by the browser. ### Example For demo purposes, we'll show one happy path using Transloadit's face detection with a picker and our CDN bundle. This copy-paste demo deliberately places an Auth Key and unsigned Instructions in the browser. Use it only with test credentials. For production, use the server-signed Template flow in the framework guide above. ```html Select Files ``` For more examples, take a look at[examples/⁠](https://github.com/transloadit/uppy/tree/main/examples), or[try them live⁠](https://uppy.io/examples/dashboard/). Uppy and Transloadit are very versatile so you may have a different need, and likely, we already support it. ### Documentation See [the full documentation for Uppy's Transloadit Plugin⁠](https://uppy.io/docs/transloadit/), which is the complete plugin API. Start with the [framework guide⁠](https://uppy.io/docs/guides/uppy-transloadit/)for an end-to-end integration.