BucketKit

Introduction

S3 Upload Library for Node.js and React

Nilovon BucketKit

BucketKit is a modern, type-safe S3 upload library for Node.js and React applications. It provides a simple yet powerful API for handling file uploads with presigned URLs, validation, and beautiful UI components.

Features

  • 🚀 Easy to use - Simple API with sensible defaults
  • 📦 Type-safe - Full TypeScript support with strict types
  • 🔒 Secure - Server-side validation and presigned URLs
  • 🎨 Beautiful UI - shadcn/ui-based React components
  • Fast - Direct-to-S3 uploads with progress tracking
  • 🔌 Extensible - Custom policies, path resolvers, and theming

Packages

Quick Start

Installation

# Install both packages
pnpm add @nilovon/bucketkit-core @nilovon/bucketkit-react

# Or install separately
pnpm add @nilovon/bucketkit-core  # Backend only
pnpm add @nilovon/bucketkit-react # Frontend only

Backend Setup

import { createBucketKit } from '@nilovon/bucketkit-core';

const bucketKit = createBucketKit({
  provider: 'aws-s3',
  region: 'us-east-1',
  bucket: 'my-uploads',
  defaultUploadPolicy: {
    maxSize: 10 * 1024 * 1024, // 10 MB
    allowedMimeTypes: ['image/*', 'application/pdf'],
  },
});

// In your API route handler
const result = await bucketKit.createPresignedUpload({
  fileName: 'photo.jpg',
  contentType: 'image/jpeg',
  size: 1024000,
});

// Returns: { url, method, headers, key, publicUrl, expiresIn }

Frontend Setup

import {
  BucketKitProvider,
  BucketKitDropzone,
  BucketKitUploadList,
} from '@nilovon/bucketkit-react';

function App() {
  return (
    <BucketKitProvider
      endpoint="/api/upload"
      onUploadComplete={(file) => console.log('Uploaded:', file.url)}
    >
      <BucketKitDropzone
        multiple
        accept={['image/*', 'application/pdf']}
        maxSize={10 * 1024 * 1024}
      />
      <BucketKitUploadList />
    </BucketKitProvider>
  );
}

Next Steps

On this page