https://github.com/mgalacyber/nextjs-file-uploader
https://github.com/mgalacyber/nextjs-file-uploader
file-upload nextjs reactjs supabase tailwindcss temp-files uploader
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/mgalacyber/nextjs-file-uploader
- Owner: MGalaCyber
- License: mit
- Created: 2025-07-06T07:13:15.000Z (12 months ago)
- Default Branch: master
- Last Pushed: 2025-07-06T09:19:06.000Z (12 months ago)
- Last Synced: 2025-07-06T10:29:11.671Z (12 months ago)
- Topics: file-upload, nextjs, reactjs, supabase, tailwindcss, temp-files, uploader
- Language: TypeScript
- Homepage: https://nextjs-file-uploader-nine.vercel.app
- Size: 227 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🗂️ Temp File Uploader
A simple and secure file uploader built with **Next.js App Router** and **Supabase Storage**.
This tool allows users to upload files and share them temporarily — all files are automatically deleted after **7 days**.
---
## 🚀 Features
- 🔐 Upload files securely to Supabase Storage
- 📎 Get public & local preview links instantly
- 🗑️ Automatic file cleanup after 7 days
- 🖼️ Supports image & video preview detection
- 🧩 Built with Next.js 15+ App Router (API Routes)
---
## 🛠️ Environment Configuration
Create a `.env` file in the root directory and add your Supabase credentials:
```env
BUCKET_NAME=files
SUPABASE_URL=https://YOUR_PROJECT_ID.supabase.co
SUPABASE_ANON_KEY=YOUR_SUPABASE_ANON_KEY
BASE_URL=https://domain.com
CDN_URL=https://cdn.domain.com
```
🔍 How to get these values:
You can find them in your Supabase dashboard:
- 🔗 [Go to Supabase Project Settings → API](https://supabase.com/dashboard/project/YOUR_PROJECT_ID/storage/buckets/temp-files?showConnect=true)
- SUPABASE_URL → Found under "Project URL"
- SUPABASE_ANON_KEY → Found under "anon public" in "Project API Keys"
- 🔗 [Go to Supabase Storage → Buckets](https://supabase.com/dashboard/project/YOUR_PROJECT_ID/settings/api-keys)
- BUCKET_NAME → Choose or create a bucket (e.g., `files`, `temp-files`)
- BUCKET_POLICIES → Select `New policy > For full customization > Select All (Allowed operation section)`
Make sure your bucket's public access is enabled, or adjust RLS policies accordingly.