Woff Space is a minimal, zero-friction sharing platform. Create a temporary space in one click, drop in files, images, notes, or code, and share it instantly via a short room code or link. No accounts, no verification — just fast, secure sharing.
🔗 Live: https://woff.space
| Layer | Technology |
|---|---|
| Framework | Next.js 15 (App Router) |
| Language | TypeScript 5 |
| Styling | Tailwind CSS 3 |
| UI Components | Radix UI + ShadCN/UI |
| Database & Auth | Supabase (PostgreSQL + Storage + RLS) |
| Animations | Framer Motion |
| Icons | Lucide React + React Icons |
| Deployment | Vercel |
- Instant Spaces — Create a shareable space in one click, no sign-up
- 4-Digit Room Code — Join any space with a simple 4-digit code
- Multi-Content Support — Share text, images, files, PDFs, and code snippets
- Rich Note Editor — TipTap editor with Markdown shortcuts, versioned autosave, and offline drafts
- Resumable Uploads — Real byte progress, cancellation, retry, and atomic multi-file publishing
- QR Code Sharing — Generate and scan QR codes to share/join spaces
- Invisible Anonymous Auth — Secure ownership through Supabase Auth with no login UI
- Owner Recovery — A recovery key can restore room ownership after a session is lost
- Dark/Light Theme — System-aware theme with manual toggle
- Online Notepad — Dedicated notepad with shareable link
- SEO Optimized — Structured data, meta tags, sitemap, and blog
- Responsive Design — Works across desktop, tablet, and mobile
- Privacy-aware Analytics — Analytics are disabled on room and note routes
| Package | Purpose |
|---|---|
next |
React framework (App Router) |
react / react-dom |
UI library |
typescript |
Type safety |
@supabase/supabase-js |
Database, auth, and file storage |
| Package | Purpose |
|---|---|
tailwindcss |
Utility-first CSS |
@radix-ui/* |
Accessible primitives (Dialog, Dropdown, Popover, Tooltip, etc.) |
class-variance-authority |
Component variant management |
clsx + tailwind-merge |
Class name utilities |
framer-motion |
Animations and transitions |
lucide-react / react-icons |
Icon libraries |
next-themes |
Theme management |
sonner |
Toast notifications |
| Package | Purpose |
|---|---|
nanoid |
Short unique ID generation |
qrcode / qr-scanner |
QR generation and scanning |
date-fns |
Date formatting |
html2canvas / jspdf / jszip |
Export/download utilities |
@vercel/speed-insights |
Performance monitoring |
| Package | Purpose |
|---|---|
eslint + eslint-config-next |
Linting |
playwright |
End-to-end testing |
postcss |
CSS processing |
- Node.js 18+
- npm (or yarn/pnpm)
- Supabase account (supabase.com)
- Clone the repository
git clone https://github.com/RizviBR0/Woff.git
cd Woff- Install dependencies
npm install- Configure environment variables
Create a .env.local file in the root:
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
SUPABASE_SERVICE_ROLE_KEY=your_server_only_secret_or_legacy_service_role_key
CRON_SECRET=a_long_random_secret
NEXT_PUBLIC_SITE_URL=http://localhost:3000- Set up the database
Enable anonymous sign-ins, then apply every SQL file in
supabase/migrations in filename order. Together they install the tables,
restricted RPCs, private Storage policies, Row Level Security, advisor
hardening, optimized indexes, and the legacy-file compatibility migration.
- Start the dev server
npm run devOpen http://localhost:3000 in your browser.
Made with 🧡