The UploadKit blog
Tutorials, comparisons and engineering notes from the team building file uploads for developers.
- Tutorials
File uploads in Next.js with Auth.js and MongoDB
End-to-end Next.js file upload: Auth.js v5 session check, R2 presigned URL, Mongoose metadata model, cached connection, rate limits, and a server component list.
- Tutorials
File uploads in Remix and React Router v7
The correct pattern for Remix and React Router v7 file uploads: presigned URLs in an action, client direct-to-storage PUT, and revalidation on success.
- Tutorials
File uploads in SvelteKit with presigned URLs
Build a type-safe SvelteKit file upload flow with Cloudflare R2 presigned URLs, a Svelte 5 dropzone, hooks.server.ts auth, and zod validation end to end.
- Engineering
Chunked and resumable uploads explained
How chunked and resumable uploads work under the hood — S3/R2 multipart, the tus protocol, and a minimal TypeScript implementation you can actually ship.
- Engineering
File upload progress bars done right
Most file upload progress bars lie. Here's the real model — queued, uploading, processing, complete — and a React state machine that handles retries and multi-file aggregation.
- Tutorials
Build a modern drag-and-drop file upload in React
A production-grade React drag and drop file upload from scratch: previews, validation, accessibility, and the File System Access API with a proper fallback.
- Engineering
Building an MCP server for your SaaS: lessons from UploadKit
How to design, ship, and register an MCP server so AI coding assistants become first-class users of your SaaS. Stdio vs HTTP, tools, auth, and gotchas.
- Tutorials
How to give Claude Code knowledge of your upload library with MCP
Teach Claude Code, Cursor, and Windsurf your upload library's components, scaffolding, and install commands with one MCP server. Real prompts, zero hallucinations.
- Tutorials
Migrating from UploadThing to UploadKit
Migrate UploadThing to UploadKit in 30 minutes. Side-by-side API diff, route handler conversion, data migration via BYOS, and the gotchas we hit in production.
- Engineering
File upload security: the 12-point checklist
OWASP-aligned file upload security checklist. MIME validation, magic bytes, presigned URLs, virus scanning, content-disposition, rate limiting — with code.
- Comparisons
S3 vs R2 vs Backblaze B2: real pricing compared (2026)
S3 vs R2 vs Backblaze pricing with real 2026 numbers. A 1 TB stored, 10 TB egress scenario, decision matrix, and when each provider actually wins.
- Engineering
BYOS explained: owning your storage without building it
Bring Your Own Storage lets you keep buckets, billing, and compliance while using a managed upload SDK. Here's how the pattern works and how UploadKit ships it.
- Tutorials
Building an image crop tool in React
Build a React image crop tool from scratch with the Canvas API — drag handles, aspect ratio lock, output blob. Walk through ~400 lines of TypeScript.
- Engineering
Presigned URLs vs server proxy uploads: which to choose
Architectural comparison of presigned URLs vs server proxy uploads. Latency, cost, security, and observability trade-offs with a clear recommendation.
- Tutorials
How to upload files to Cloudflare R2 in Next.js
Step-by-step guide to upload files to Cloudflare R2 in Next.js using presigned PUT URLs, the AWS SDK, and a typed Route Handler. Includes CORS config.
- Comparisons
UploadThing alternatives in 2026
Honest comparison of UploadThing alternatives in 2026 — UploadKit, Uploadcare, Filestack, Bytescale, and rolling your own. Pricing, BYOS, OSS, and DX.