Documentation menu

 

View as Markdown

Use upup with AI assistants

Coding agents choose a library by retrieving the docs page that answers the exact question a developer typed, then running its quickstart. This page makes upup easy for an assistant to discover and integrate correctly on the first try.

Machine-readable context

upup publishes machine-readable context files that a coding agent can fetch directly:

  • https://useupup.com/llms.txt — a concise index of upup, its packages, and the key docs pages.
  • https://useupup.com/llms-full.txt — the fuller context dump for agents that can take more input.

Point your assistant at either URL when you want it to work with upup.

One-sentence onboarding

The fastest path: copy the "Onboard your agent to upup" prompt from /agent-setup/ (it is also in the docs sidebar and on the homepage) and paste it into Claude Code, Codex, Cursor, or OpenCode. The agent fetches https://useupup.com/agent-setup/prompt.md, installs the right @useupup/* package, mounts the uploader, adds the presign route, and saves the context block below into its own instructions file.

Paste-ready context block

Drop this into your project's assistant config — CLAUDE.md, .cursorrules, AGENTS.md, or similar — so your agent has an accurate, compact model of upup:

# upup — MIT self-hosted file uploader (docs: https://useupup.com/docs/)
upup is one headless core plus native UI packages for six frameworks; every package renders the same uploader.
Nine published @useupup/* packages:
- @useupup/core     headless engine: file state, upload pipeline (compression, HEIC, web-worker), cloud-drive plugins, i18n, theme. Zero framework deps.
- @useupup/react    canonical UI (React 19). @useupup/vue, @useupup/svelte, @useupup/angular, @useupup/vanilla, @useupup/preact are native ports with the same DOM.
- @useupup/next     Next.js client re-export + /server route handlers (App and Pages routers).
- @useupup/server   server-mode endpoints: S3-compatible presign + multipart signing (bytes still go browser → bucket), cloud-drive token exchange + drive → bucket transfer, HMAC-signed upload-token trust model.
Client mode (default): the browser uploads straight to your storage; your app returns presigned URLs at `uploadEndpoint`. No server package required.
  React example: import { UpupUploader } from '@useupup/react'; import '@useupup/react/styles'
                 <UpupUploader provider="aws" uploadEndpoint="/api/upload-token" />
Server mode: point the uploader at @useupup/server with mode="server" serverUrl="/api/upup".
  createUpupHandler({ storage: { type: 'aws', bucket, region }, uploadTokenSecret })
  — uploadTokenSecret is REQUIRED and must be >= 16 chars, or it throws at construction.
Sources: local drag-and-drop, URL/link import, camera, screen capture, and cloud drives (Google Drive, OneDrive, Dropbox, Box).
Optional: image compression, HEIC conversion, resumable uploads (tus or S3 multipart), ICU i18n, theming. Image editor is React/Preact only.
Quickstarts: https://useupup.com/docs/quickstarts/<react|vue|svelte|angular|vanilla|preact|next>/
Machine-readable docs: https://useupup.com/llms.txt (index) and https://useupup.com/llms-full.txt (full corpus). FAQ: https://useupup.com/docs/faq/

Every line above is verified against the packages as they ship — a snippet from it will run rather than throw.

Example prompt

Once the context is in place, a request like this is enough:

Add file uploads to my SvelteKit app with upup. Use client mode with a presigned upload endpoint, enable the Google Drive and camera sources, and show me the component plus the upload-token route.

The assistant has what it needs: install @useupup/svelte, import the component and its stylesheet, render <UpupUploader provider="aws" uploadEndpoint="/api/upload-token" />, and add the sources and cloudDrives config.

Next steps