Vai al contenuto principale
La scheda Code ti permette di visualizzare e modificare il codice sorgente della tua app direttamente, dandoti controllo sulla funzionalità, il design e il comportamento dell’app mentre vedi le modifiche immediatamente.
La scheda Code è per sviluppatori che vogliono più controllo. Per modifiche più semplici, usa l’editor visivo e gli strumenti IA di Base44.
The Code tab interface showing your app's source code

​
Accedere alla scheda Code

Per aprire la scheda Code:
  1. Vai alla dashboard dell’app.
  2. Clicca la scheda Code.
La scheda Code mostra i file del progetto in un esploratore di file a sinistra, con l’editor di codice che occupa lo spazio principale.
Accessing the Code tab from your app dashboard
Usa la funzionalità Files used in this page per vedere quali file alimentano la pagina che stai visualizzando in anteprima. Questo ti mostra esattamente quali file di codice sono in esecuzione, così sai dove andare quando vuoi modificare la pagina o investigare un problema. Ogni voce nell’elenco mostra il nome del file e il percorso della cartella, raggruppato per posizione nel progetto come pagine o componenti. Per visualizzare i file usati in una pagina:
  1. Vai all’editor dell’app.
  2. Clicca l’icona More Actions in alto a destra.
  3. Clicca Files used in this page.
Viewing files used on a page of your app
Se vuoi passare da questa vista mirata alla struttura file completa, clicca See all files. Questo ti porta alla vista completa dei file di codice così puoi continuare a esplorare da lì.

​
Modificare con anteprima live

La scheda Code offre una vista split-screen che mostra il codice da un lato e un’anteprima live dell’app dall’altro. Questo ti permette di vedere le modifiche istantaneamente senza cambiare contesto.
Split screen view showing code and live preview
Per modificare con anteprima live:
  1. Apri un file nella scheda Code.
  2. Clicca il toggle split-screen nell’angolo in alto a destra.
  3. Modifica il codice a sinistra e vedi le modifiche a destra.
Ogni volta che apporti modifiche al codice:
  • Clicca Save in fondo allo schermo per applicare le modifiche e aggiornare l’anteprima con il codice più recente.
  • Clicca Discard in fondo allo schermo se vuoi eliminare tutte le modifiche non salvate e tornare all’ultima versione salvata del file.
Importante: se apporti modifiche al codice dell’app, assicurati di cliccare Publish perché vadano live sulla tua app.
Quando sei pronto a lasciare lo split screen, clicca Exit split. Per lo sviluppo locale con il tuo IDE, consulta GitHub Integration.

​
Rivedere le modifiche di codice IA

Quando l’IA modifica la tua app, puoi aprire la finestra Code changes per vedere esattamente cosa ha cambiato prima di pubblicare. La finestra mostra ogni file che l’IA ha toccato, raggruppato per cartella, con una vista diff per ciascuno. Per aprire la finestra Code changes:
  1. Vai alla chat IA nell’editor dell’app.
  2. Passa il mouse su un messaggio in cui l’IA ha modificato o creato un file.
  3. Clicca l’icona a tre punti accanto a quella modifica e seleziona View Changes.
Si apre una finestra con un albero di file a sinistra e il diff per il file selezionato a destra. Una barra di statistiche in alto mostra quanti file sono stati aggiunti, modificati ed eliminati. I file nell’albero sono codificati per colore in base allo stato:
  • Verde per file appena aggiunti.
  • Ambra per file modificati, che si aprono in una vista diff affiancata.
  • Rosso per file eliminati.
Clicca qualsiasi file nell’albero per saltare direttamente al suo diff.

​
FAQ

Sì. Puoi aprire e modificare qualsiasi file di codice che appare nel pannello Code files, incluse pagine, componenti, layout e helper di entità. Se una parte dell’app è generata per te, appare comunque come codice regolare che puoi modificare.
No. Puoi lavorare nell’editor di codice a larghezza intera se preferisci più spazio. Lo split screen è utile quando vuoi vedere l’anteprima accanto al codice, ma puoi disattivarlo in qualsiasi momento e riaprirlo in seguito.
Discard rimuove tutte le modifiche non salvate nel file attivo e ripristina l’ultima versione salvata. Utile se provi qualcosa che non funziona e vuoi tornare indietro rapidamente. Una volta cliccato Discard, non puoi recuperare il codice non salvato di quella sessione.
Non devi essere un esperto, ma una familiarità di base con React e JSX aiuta. Puoi iniziare con piccole modifiche come aggiornare il testo, sostituire componenti o cambiare stili semplici, poi passare a logica più avanzata man mano che acquisisci fiducia.
Questa pagina è stata tradotta utilizzando l’IA. Per informazioni più accurate e aggiornate, consulta la versione inglese.