> ## Documentation Index
> Fetch the complete documentation index at: https://docs.base44.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Code Tab

> Modifica il codice sorgente della tua app direttamente nella scheda Code di Base44 con anteprima live e pieno controllo dello sviluppatore.

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.

<Note>
  La scheda Code è per sviluppatori che vogliono più controllo. Per modifiche più semplici, usa
  l'editor visivo e gli strumenti IA di Base44.
</Note>

<Frame caption="The Code tab interface showing your app's source code">
  <img src="https://mintcdn.com/base44/HSXlsKQvBkYN-DXR/codeer.png?fit=max&auto=format&n=HSXlsKQvBkYN-DXR&q=85&s=845561c033d8e1acadf501429ed5efbb" alt="The Code tab interface showing your app's source code" width="1915" height="958" data-path="codeer.png" />
</Frame>

## 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](../overview/project-structure) in un esploratore di file a sinistra, con l'editor di codice che occupa lo spazio principale.

<Frame caption="Accessing the Code tab from your app dashboard">
  <img src="https://mintcdn.com/base44/hrVkAqsRzoi9NYCy/images/codepanel.png?fit=max&auto=format&n=hrVkAqsRzoi9NYCy&q=85&s=26096b47df03c978b9a81a823cd179fd" alt="Accessing the Code tab from your app dashboard" width="1912" height="955" data-path="images/codepanel.png" />
</Frame>

## Navigare la codebase

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**.

<Frame caption="Viewing files used on a page of your app">
  <img src="https://mintcdn.com/base44/ml9BQnGdt1cp4mqU/images/seeallfiles.png?fit=max&auto=format&n=ml9BQnGdt1cp4mqU&q=85&s=2017f1a72e6b880c7405b9c6c1d8784c" alt="Viewing files used on a page of your app" width="2532" height="1208" data-path="images/seeallfiles.png" />
</Frame>

<Tip>
  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ì.
</Tip>

## 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.

<Frame caption="Split screen view showing code and live preview">
  <img src="https://mintcdn.com/base44/Kb6mZTf4mNXOF_gr/images/split.png?fit=max&auto=format&n=Kb6mZTf4mNXOF_gr&q=85&s=3b0556cac2c3cac886d1332d10521dc4" alt="Split screen view showing code and live preview" width="1908" height="390" data-path="images/split.png" />
</Frame>

**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.

<Warning>
  **Importante:** se apporti modifiche al codice dell'app, assicurati di cliccare
  **Publish** perché vadano live sulla tua app.
</Warning>

Quando sei pronto a lasciare lo split screen, clicca **Exit split**.

Per lo sviluppo locale con il tuo IDE, consulta [GitHub Integration](../local-development/github).

## 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

<AccordionGroup>
  <Accordion title="Can I edit every part of my app's code?">
    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.
  </Accordion>

  <Accordion title="Do I need to use split screen to edit code?">
    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.
  </Accordion>

  <Accordion title="What happens if I click Discard?">
    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.
  </Accordion>

  <Accordion title="Do I need to be an experienced developer to edit the code?">
    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.
  </Accordion>
</AccordionGroup>

<Note>Questa pagina è stata tradotta utilizzando l'IA. Per informazioni più accurate e aggiornate, consulta la [versione inglese](/). </Note>
