convex-file-storage

Complete file handling including upload flows, serving files via URL, storing generated files from actions, deletion, and accessing file metadata from system tables

By waynesutton · 2,530 installs

npx skills add waynesutton/convexskills --skill convex-file-storage

Source repository · Upstream listing

Convex File Storage Handle file uploads, storage, serving, and management in Convex applications with proper patterns for images, documents, and generated files. Documentation Sources Before implementing, do not assume; fetch the latest documentation: Primary: https://docs.convex.dev/file storage Upload Files: https://docs.convex.dev/file storage/upload files Serve Files: https://docs.convex.dev/file storage/serve files For broader context: https://docs.convex.dev/llms.txt Instructions File Storage Overview Convex provides built in file storage with: Automatic URL generation for serving files Support for any file type (images, PDFs, videos, etc.) File metadata via the storage system table Integration with mutations and actions Generating Upload URLs Client Side Upload Saving File References Serving Files via URL Displaying Files in React Storing Generated Files from Actions Accessing File Metadata Deleting Files Image Upload with Preview Examples Schema for File Storage Best Practices Never run npx convex deploy unless explicitly instructed Never run any git commands unless explicitly instructed Validate file types and sizes on the client before uploading Store file metadata (name, type, size) in your own table Use the storage system table only for Convex metadata Delete storage files when deleting database references Use appropriate Content Type headers when uploading Consider image optimization for large images Common Pitfalls 1. Not setting Content Type header Files may not serve correctly 2. Forgetting to delete storage Orphaned files waste storage 3. Not validating file types Security risk for malicious uploads 4. Large file uploads without progress Poor UX for users 5. Using deprecated getMetadata Use ctx.db.system.get instead References Convex Documentation: https://docs.convex.dev/ Convex LLMs.txt: https://docs.convex.dev/llms.txt File Storage: https://docs.convex.dev/file storage Upload Files: https://docs.convex.dev/file storage/upload files Serve Files: https://docs.convex.dev/file storage/serve files