# Introduction (https://s3.dimah.dev/docs/react)



[`@dimah-s3/react`](https://www.npmjs.com/package/@dimah-s3/react) is a headless S3 client for React. It manages file intake, validation, progress tracking, retry, cancellation, and multipart transfers — leaving full UI control to you.

Upload and download streams run directly between the browser and the bucket, keeping credentials secure on the server.

## Key features [#key-features]

* **Headless architecture** — Full state management and accessible DOM props without imposing markup or styles.
* **Direct-to-bucket transfers** — Fast, signed uploads and downloads that bypass your application server.
* **Multipart support** — Automatic chunking for large files with resumable state via `UploadStore`.
* **Automatic constraint sync** — Infers file size and MIME type constraints directly from server route definitions.
* **Ready-made UI** — Optional accessible [shadcn components](https://s3.dimah.dev/docs/react/ui) for instant drop-in controls.
* **Backend agnostic** — Works seamlessly with `@dimah-s3/server` or any custom API implementing `S3Api`.

## Documentation [#documentation]

<Cards>
  <Card title="Setup" href="/docs/react/setup" description="Initialize createS3Client, configure S3Provider, and call your first hook." />

  <Card title="Upload" href="/docs/react/hooks/upload" description="useUpload — single and multi-file uploads with progress tracking." />

  <Card title="Download" href="/docs/react/hooks/download" description="useDownload — direct downloads and progress streams." />

  <Card title="Delete" href="/docs/react/hooks/delete" description="useDelete — confirm and remove objects through your API." />

  <Card title="UI Components" href="/docs/react/ui" description="Ready-made shadcn buttons and dropzones built on these hooks." />

  <Card title="Upload Store" href="/docs/react/upload-store" description="Persist and resume in-progress multipart uploads across page reloads." />

  <Card title="Helpers" href="/docs/react/helpers" description="Pure utilities for progress formatting, file sizing, and validation." />

  <Card title="Forms" href="/docs/react/forms" description="Add file uploads to React Hook Form or TanStack Form." />

  <Card title="TanStack Query" href="/docs/react/tanstack-query" description="Invalidate cached records after a confirmed upload." />

  <Card title="Custom Backend" href="/docs/react/custom-backend" description="Connect the headless hooks to any existing REST or RPC backend." />
</Cards>