Finora hai lavorato con esempi isolati di React. Nello sviluppo reale, le applicazioni React vengono create ed eseguite come progetti con una struttura e strumenti predefiniti.

In questo capitolo, apprenderai come creare ed eseguire un progetto React utilizzando Vite, uno strumento di build moderno, veloce, leggero e comunemente utilizzato nei progetti in produzione.

Creazione di un progetto React con Vite

Per creare un nuovo progetto React, aprire il terminale ed eseguire il seguente comando:

npm create vite@latest

Verrà richiesto di:

1. Inserire un nome del progetto;
2. Selezionare un framework → scegliere React;
3. Selezionare una variante → scegliere JavaScript.

Al termine della configurazione, accedere alla cartella del progetto:

cd project-name

Installare le dipendenze del progetto:

npm install

Avvio del server di sviluppo

Per avviare il server di sviluppo React, eseguire:

npm run dev

Dopo aver eseguito questo comando:

• Vite avvia un server di sviluppo locale;
• Un URL locale (solitamente http://localhost:5173) appare nel terminale;
• Aprendo questo URL nel browser viene visualizzata l'app React.

Qualsiasi modifica apportata al codice verrà aggiornata automaticamente nel browser.

Comprendere cosa è appena successo

Quando hai avviato il server di sviluppo:

• Vite ha effettuato il bundle del tuo codice React;
• React ha renderizzato l'applicazione nel browser;
• L'app è entrata in modalità di sviluppo, ottimizzata per un feedback rapido.

Ora hai un vero progetto React in esecuzione localmente.