Dashbeam

Condividi file con chi ti sta vicino, e anche con chi è lontano

Cosa fa

Strumento per mandare file tra dispositivi vicini o a distanza, senza cavi e senza account.

Come guadagna

Progetto open source su GitHub con oltre 10.000 stelle, che non dichiara incassi. Ha licenza AGPL: puoi partire dal suo codice, ma se offri la tua versione online devi pubblicare anche il tuo codice modificato. Idee nostre per guadagnare: versione per uffici con più spazio e cronologia, a pagamento.

Rendilo tuo

• Per scuole e uffici: passare file dal telefono al computer dell'aula o della reception.
• Senza registrazione: è proprio questo che piace.

Le frasi da scrivere all'AI

1. Base del sito e grafica

Crea un'app web in italiano chiamata "Passa File": manda file tra due dispositivi (telefono e computer, due amici) senza cavi e senza account: si apre il sito su entrambi, si inquadra un codice QR, e il file passa direttamente da un dispositivo all'altro. Usa React, Vite, TypeScript e Tailwind CSS.

Pagine da creare:
1. Pagina principale: "Invia" o "Ricevi"
2. Invio: scegli i file, mostra il codice QR e il codice di 6 cifre
3. Ricezione: inquadra il QR o scrivi il codice, accetta i file
4. Avanzamento del trasferimento e conferma
5. Pagina "Come funziona" e Pro

Stile: semplice e veloce: sfondo bianco, blu #2563EB, verde #22C55E per "ricevuto", carattere "Inter", codice QR grande al centro. Nessuna immagine generica di stock.

Tutto deve funzionare perfettamente da telefono. Tutti i testi in italiano, chiari e senza parole tecniche.

2. Database, account e sicurezza

Collega il progetto a Supabase e attiva la registrazione con email e password.

Crea queste tabelle:
- "stanze": codice di 6 cifre, scade dopo 10 minuti, usata solo per mettere in contatto i due dispositivi
- "profili": piano

Regole di sicurezza obbligatorie:
- i file passano direttamente tra i dispositivi (WebRTC) e non vengono salvati sul server
- il server vede solo i messaggi per collegare i due dispositivi, non il contenuto
- le stanze scadono dopo 10 minuti

Usa esattamente il codice SQL che trovi nei "Dettagli tecnici" di questa scheda: eseguilo nel SQL Editor di Supabase prima di continuare, poi collega le pagine alle tabelle.

3. Da dispositivo a dispositivo

Il collegamento usa WebRTC: i due browser si parlano direttamente e il file passa su un canale cifrato. Il server (Supabase Realtime) serve solo a scambiare i messaggi iniziali per trovarsi (segnalazione), legati a una stanza con un codice di 6 cifre che scade dopo 10 minuti.

Il file si manda a pezzi da 64 KB sul canale dati, aspettando che il buffer si svuoti per non intasare la connessione (codice nei Dettagli tecnici); chi riceve ricompone i pezzi e scarica il file.

Funziona sulla stessa rete e anche a distanza; in rari casi (reti aziendali molto chiuse) serve un server TURN di appoggio, che inoltra i dati cifrati senza poterli leggere.

4. Pro e sicurezza

Prima di ricevere, si vede il nome e la dimensione di ogni file e si accetta. Avviso: "Ricevi file solo da persone che conosci".

Pro: file oltre 2 GB, più destinatari insieme, invio di una cartella intera, e stanze fisse tra i propri dispositivi.

5. Pagamenti con Stripe

Aggiungi un pagamento singolo di 4,99 € una volta sola. Il pagamento sblocca file grandi, più destinatari, cartelle e i propri dispositivi collegati.

A pagamento riuscito il webhook imposta "piano" a "pro" nella tabella "profili", sulla riga dell'utente indicata in client_reference_id.

Per la sessione di pagamento e il webhook segui la guida "Pagamenti con Stripe" di Fattibile.

6. Controlli specifici di questo progetto

Oltre ai controlli della guida "Controllo finale", verifica in particolare:
1. Privacy: durante un trasferimento controlla nelle richieste di rete che il contenuto del file non passi mai dal server Supabase.
Correggi quello che non va e scrivimi cosa hai cambiato.

Dettagli tecnici

Mandare un file a pezzi su WebRTC

Il file viene mandato a pezzi da 64 KB sul canale dati; se il buffer si riempie si aspetta che si svuoti. Chi riceve ricompone i pezzi.

const PEZZO = 64 * 1024;

export async function inviaFile(canale: RTCDataChannel, file: File, onAvanzamento: (p: number) => void) {
  canale.send(JSON.stringify({ tipo: "inizio", nome: file.name, dimensione: file.size, mime: file.type }));
  canale.bufferedAmountLowThreshold = PEZZO * 16;

  for (let pos = 0; pos < file.size; pos += PEZZO) {
    if (canale.bufferedAmount > PEZZO * 64) {                  // buffer pieno: aspetta
      await new Promise((ok) => canale.addEventListener("bufferedamountlow", ok, { once: true }));
    }
    canale.send(await file.slice(pos, pos + PEZZO).arrayBuffer());
    onAvanzamento(Math.round((Math.min(pos + PEZZO, file.size) / file.size) * 100));
  }
  canale.send(JSON.stringify({ tipo: "fine" }));
}

export function riceviFile(canale: RTCDataChannel, onFile: (file: File) => void) {
  let info: { nome: string; mime: string } | null = null;
  let pezzi: ArrayBuffer[] = [];
  canale.binaryType = "arraybuffer";
  canale.onmessage = (e) => {
    if (typeof e.data === "string") {
      const msg = JSON.parse(e.data);
      if (msg.tipo === "inizio") { info = msg; pezzi = []; }
      if (msg.tipo === "fine" && info) onFile(new File(pezzi, info.nome, { type: info.mime }));
    } else pezzi.push(e.data);
  };
}

Pezzi comuni a tutti i progetti

• Pagamenti con Stripe
• Profili, piano e crediti
• Controllo finale prima di pubblicare

Glossario

WebRTC

La tecnologia dei browser per collegare due dispositivi direttamente, usata per videochiamate e trasferimenti di file.

Segnalazione

I primi messaggi che due dispositivi si scambiano tramite un server per trovarsi; poi parlano direttamente.