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.
- 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.
- 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.
- 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.
- 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.