Surf

Quaderni personali con l'AI: file e pagine web organizzati in appunti

Cosa fa

Un'app per raccogliere file e pagine web in quaderni, e far scrivere all'AI appunti e riassunti partendo da quel materiale. Open source, con i dati in locale.

Come guadagna

Progetto open source su GitHub con oltre 3.000 stelle, che non dichiara incassi. Ha licenza Apache 2.0: puoi partire dal suo codice, anche per un prodotto a pagamento, mantenendo le note sugli autori. Idee nostre per guadagnare: sincronizzazione tra dispositivi e funzioni AI avanzate a pagamento.

Rendilo tuo

• Per studenti universitari: un quaderno per esame, con dispense, appunti e domande di ripasso.
• Per avvocati: un quaderno per pratica.

Le frasi da scrivere all'AI

1. Base del sito e grafica

Crea un'app web in italiano chiamata "Quaderno Intelligente": raccogli in quaderni tematici i tuoi file (PDF, appunti, pagine web salvate) e fai domande all'AI su quel materiale: risponde solo da lì, con le citazioni precise di dove ha trovato ogni informazione. Usa React, Vite, TypeScript e Tailwind CSS.

Pagine da creare:
1. Pagina iniziale con un esempio e i prezzi
2. I miei quaderni
3. Quaderno: fonti a sinistra, chat al centro, appunti a destra
4. Aggiungi fonti: PDF, testo, link di una pagina web
5. Appunti e riassunti generati, modificabili ed esportabili

Stile: da studio ordinato: sfondo bianco carta #FCFCFA, blu inchiostro #1E40AF, giallo evidenziatore #FEF08A per le citazioni, carattere "Inter" e "Lora" per gli appunti. 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:
- "quaderni": titolo, collegati all'utente
- "fonti": titolo, tipo, file nello Storage, testo estratto
- "pezzi": pezzi di testo di ogni fonte con embedding e posizione (pagina)
- "note": appunti e riassunti salvati

Regole di sicurezza obbligatorie:
- ogni utente vede solo i suoi quaderni, fonti e note
- i file stanno in uno spazio privato
- i crediti non si modificano dal browser

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. Risposte solo dalle tue fonti, con citazioni

Le fonti caricate vengono lette (pdf.js per i PDF, estrazione del testo per le pagine web salvate dall'utente) e divise in pezzi con la pagina di provenienza; per ogni pezzo si calcola l'embedding e lo si salva con pgvector.

Quando l'utente chiede qualcosa, si cercano i pezzi più vicini nel quaderno e Claude risponde solo con quelle informazioni, mettendo dopo ogni frase il riferimento [1], [2] alla fonte e alla pagina. Cliccando il riferimento si apre la fonte evidenziata. Se l'informazione non c'è, lo dice.

Pulsanti rapidi: "Riassumi questa fonte", "Fammi 10 domande di ripasso", "Crea uno schema".

4. Appunti ed esportazione

Le risposte utili si salvano come appunti nel quaderno, modificabili, con le citazioni che restano cliccabili. Esportazione in Markdown, Word e PDF.

Quaderni condivisibili in sola lettura con un link (per gruppi di studio), senza condividere i file originali se l'utente non vuole.

5. Pagamenti con Stripe

Aggiungi pacchetti di crediti: 100 domande a 7 €, 500 domande a 25 €. Ogni nuovo utente riceve 20 crediti gratis. Ogni domanda o riassunto costa un credito; caricare fonti è gratis fino a 50 MB. Mostra sempre in alto quanti crediti restano e, quando finiscono, un riquadro per comprarne altri.

A pagamento riuscito il webhook aggiunge i crediti del pacchetto con la funzione aggiungi_crediti.

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. Citazioni: fai 10 domande e apri ogni citazione: la frase della risposta deve trovarsi davvero nel punto citato.
Correggi quello che non va e scrivimi cosa hai cambiato.

Dettagli tecnici

Pezzi con la pagina di provenienza

Ogni pezzo ricorda fonte e pagina, così la risposta può citare con precisione. La ricerca resta dentro il quaderno dell'utente.

create extension if not exists vector;

create table pezzi (
  id bigint generated always as identity primary key,
  quaderno_id uuid not null,
  fonte_id uuid not null,
  utente_id uuid not null references auth.users(id) on delete cascade,
  pagina int,
  testo text not null,
  embedding vector(1024) not null
);
create index on pezzi using hnsw (embedding vector_cosine_ops);
alter table pezzi enable row level security;
create policy "le mie righe" on pezzi
  for all using (auth.uid() = utente_id) with check (auth.uid() = utente_id);

create function cerca_nel_quaderno(quaderno uuid, domanda vector(1024), quanti int default 8)
returns table (id bigint, fonte_id uuid, pagina int, testo text)
language sql stable as $          -- non security definer: valgono le regole dell'utente
  select id, fonte_id, pagina, testo
  from pezzi
  where quaderno_id = quaderno
  order by embedding <=> domanda
  limit quanti;
$;

Istruzioni per l'AI: chiedi

La Edge Function che risponde. Prima di chiamare Claude, il server cerca i pezzi con cerca_nel_quaderno e li mette nella "richiesta", numerati, insieme alla domanda. Il resto della funzione (accesso, crediti, rimborso se l'AI rifiuta) è uguale per tutti i progetti: è nella guida "Chiamare l'AI dal server".

Rispondi alla domanda dell'utente usando SOLO i pezzi di fonte forniti, numerati [1], [2]... con titolo della fonte e pagina. Dopo ogni frase metti il numero del pezzo da cui viene l'informazione, es. "La fotosintesi avviene nei cloroplasti [3]." Se i pezzi non contengono la risposta, dillo chiaramente e non usare conoscenze esterne. Rispondi in italiano, in modo chiaro e ordinato.

Pezzi comuni a tutti i progetti

• Pagamenti con Stripe
• Profili, piano e crediti
• Chiamare l'AI dal server
• Controllo finale prima di pubblicare

Glossario

Embedding

Un testo trasformato in numeri, che permette di cercare per significato e non solo per parole uguali.

Storage

Lo spazio di Supabase dove si salvano i file, come foto e audio, con le sue regole di accesso.

Citazione

Il riferimento preciso alla fonte e alla pagina da cui viene un'informazione.