Storage
A minimal guide on how to use the built-in S3 storage system.
The storage feature lets you work with an S3 compatible bucket immediately — no setup beyond environment variables. Upload files, replace them, list them, generate public URLs — all through a small, ready to use API.
1. Set your environment variables
AWS_ACCESS_KEY_ID=
AWS_SECRET_ACCESS_KEY=
S3_ENDPOINT=
S3_REGION=
S3_BUCKET_NAME=
VITE_S3_PUBLIC_URL=Once these are filled in, storage becomes ready to use across your project.
2. Upload a file
Use the provided API wherever you need to store user uploads (eg: avatars, documents, images, xxx).
API utilization
import { storageAPI } from "@/features/storage/storageAPI"
storageAPI.uploadFile({
Key: 'path/inside/bucket',
Body: <file-content>,
ContentType: <mime-type>
})Upload flow
File, Blob, buffer, or base64 turned into buffer)Key (ex: "avatars/user123.png")Body and set the correct ContentTypeThis is the only function you need to upload files anywhere in your application.
3. Replace an Existing File
Parameters
storageAPI.replaceFile({
Key: 'new/path',
Body: <file-content>,
ContentType: <mime-type>,
oldKey: 'old/path'
})Useful for profile updates and similar flows.
oldKey to automatically remove the previous fileThe API handles both deletion + upload for you.
4. Get a Public URL
API utilization
storageHelper.publicUrl("path/to/file");5. List or Delete Files
Listing files
storageAPI.listFiles("folder-prefix/");Deleting a file
storageAPI.deleteFile("path/to/file");This is commonly/mainly used for admin tools or cleanup operations.
Development Utilities
Reset & Seed Storage
The project also includes a utility that you can utilize to reset and seed your storage quickly.
It is also helpful for if you want to automatically populate initial files in your S3 bucket instead of uploading them manually.
What it does:
- Clears the
avatars/folder - Uploads default/sample images
This allows you to keep the storage consistent and makes initial deployments easier.
Behind the Scenes (Optional Reading)
You get:
- A preconfigured S3 client (connected using your environment variables)
- A simple API layer wrapping all common file operations
- Helpers for file conversions, buffers, and MIME detection (you can add more if needed)
- Support for any S3-compatible provider
You don't need to interact with the underlying S3 commands, everything is abstracted to simple/easy functions.
Summary
You only need to:
- Fill out the S3 environment variables
- Use the provided
storageAPIfunctions:uploadFilereplaceFilelistFilesdeleteFile
- Use
storageHelper.publicUrlto generate public links
Things like configuration, S3 commands, MIME detection are handled behind the scenes.