File Uploader

This is a file uploader component built with shadnc/ui, and react-dropzone. It is bootstrapped with create-t3-app.

View Demo View Github

Tech Stack

  • Framework: Next.js
  • Styling: Tailwind CSS
  • UI Components: shadcn/ui
  • Storage: uploadthing
  • ORM: Drizzle ORM
  • Validation: Zod

Features

  • Reusable useFileUpload hook for uploading files with uploadthing
  • Drag and drop file upload component with progress bar
  • React-hook-form integration with shadnc/ui form components
  • File dialog demo with adding and removing files from the scrollable list