Vite, React Router & others

Use UploadCN in any React app, with any backend.

The client packages have no framework dependencies. In a Vite or React Router app:

npx shadcn@latest add @uploadcn/file-upload

Point the adapter at your backend:

import { s3Adapter } from "@uploadcn/core"

import { FileUpload } from "@/components/file-upload"

const adapter = s3Adapter({ endpoint: "https://api.example.com/upload", credentials: "include" })

export function App() {
  return <FileUpload adapter={adapter} />
}

Backends

createUploadRoute returns a (request: Request) => Promise<Response> handler, which fits any Web-standard server:

import { Hono } from "hono"

const app = new Hono()
app.post("/api/upload", (c) => upload.POST(c.req.raw))

Not using JavaScript on the server? Implement the route protocol in any language; it's one JSON endpoint.

On this page