Building My Invoice App – Added File Attachments Today

I’m still working on my invoice tool for freelancers and small businesses, and today I added a new feature: file attachments for each client or invoice.

What I wanted

Let users attach receipts, PDFs, images, contracts, etc.
Allow multiple …


This content originally appeared on DEV Community and was authored by sudarshan161219

I’m still working on my invoice tool for freelancers and small businesses, and today I added a new feature: file attachments for each client or invoice.

What I wanted

  • Let users attach receipts, PDFs, images, contracts, etc.

  • Allow multiple uploads

  • Show real-time progress

  • Rename files before/after uploading

  • Store files in the cloud (not just locally)

  • Keep everything tied to a specific client

Formats I decided to support

<input
  type="file"
  className="hidden"
  onChange={handleChange}
  multiple
  disabled={uploadedFiles.length + uploadQueue.length >= MAX_FILES}
  accept="
    .jpg,.jpeg,.png,.webp,
    .pdf,.doc,.docx,.xls,.xlsx,.csv,.txt,.odt,
    .zip,.rar,.7z,.tar,.gz,
    .mp3,.wav,.mp4,.mov,
    .psd,.ai,.svg,.fig"
 />

Tools I used

  • React + TypeScript

  • Cloudflare R2 for storage(free upto 10gb)

  • Presigned URLs for direct uploads

  • Prisma to link attachments to clients

  • Modals + toasts for UI

I’m sharing this because I’m trying to build this project piece by piece, learning as I go.
If you have ideas, better approaches, or feature suggestions, I’d love to hear them.


This content originally appeared on DEV Community and was authored by sudarshan161219


Print Share Comment Cite Upload Translate Updates
APA

sudarshan161219 | Sciencx (2025-10-31T06:19:57+00:00) Building My Invoice App – Added File Attachments Today. Retrieved from https://www.scien.cx/2025/10/31/building-my-invoice-app-added-file-attachments-today/

MLA
" » Building My Invoice App – Added File Attachments Today." sudarshan161219 | Sciencx - Friday October 31, 2025, https://www.scien.cx/2025/10/31/building-my-invoice-app-added-file-attachments-today/
HARVARD
sudarshan161219 | Sciencx Friday October 31, 2025 » Building My Invoice App – Added File Attachments Today., viewed ,<https://www.scien.cx/2025/10/31/building-my-invoice-app-added-file-attachments-today/>
VANCOUVER
sudarshan161219 | Sciencx - » Building My Invoice App – Added File Attachments Today. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/10/31/building-my-invoice-app-added-file-attachments-today/
CHICAGO
" » Building My Invoice App – Added File Attachments Today." sudarshan161219 | Sciencx - Accessed . https://www.scien.cx/2025/10/31/building-my-invoice-app-added-file-attachments-today/
IEEE
" » Building My Invoice App – Added File Attachments Today." sudarshan161219 | Sciencx [Online]. Available: https://www.scien.cx/2025/10/31/building-my-invoice-app-added-file-attachments-today/. [Accessed: ]
rf:citation
» Building My Invoice App – Added File Attachments Today | sudarshan161219 | Sciencx | https://www.scien.cx/2025/10/31/building-my-invoice-app-added-file-attachments-today/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.