Vuoi rendere il tuo sito React il più veloce e accessibile possibile? Sei nel posto giusto.
React è una libreria open source che semplifica la creazione di UI. Questo percorso di apprendimento illustra diverse API e strumenti all'interno dell'ecosistema che dovresti prendere in considerazione per migliorare il rendimento e l'usabilità della tua applicazione.
Questa guida ti mostrerà come iniziare a utilizzare un'applicazione React. Tutte le altre guide in questa sezione tratteranno argomenti per ottimizzare la velocità o l'accessibilità di un'app React.
Perché è utile?
Esistono molti contenuti che spiegano come creare applicazioni rapide e affidabili, ma non molti che mostrano come creare applicazioni React rapide e affidabili. Queste guide trattano tutto questo dal punto di vista di un'app React, in cui vengono menzionate solo librerie, API e funzionalità specifiche per l'ecosistema React.
Cosa imparerai?
I tutorial di questo percorso di apprendimento non si concentrano su:
- Come utilizzare React
- Come funziona React sotto il cofano
Anche se entrambi questi concetti verranno trattati se necessario, tutte le guide e i codelab di questa sezione si concentreranno su come creare siti React rapidi e accessibili. Per questo motivo, è necessaria una conoscenza di base di React.
Create React App
Create React App (CRA) è il modo più semplice per iniziare a creare applicazioni React. Fornisce una configurazione predefinita con una serie di funzionalità di base integrate, tra cui un sistema di compilazione contenente un bundler di moduli (webpack) e un transpiler (Babel).
In una shell a riga di comando, devi solo eseguire quanto segue per creare una nuova applicazione:
npx create-react-app app-name
Al termine dell'esecuzione del comando, puoi accedere all'applicazione ed eseguirla con i seguenti comandi:
cd new-app
npm start
Il seguente incorporamento mostra la struttura della directory e la pagina web effettiva di un'applicazione CRA appena avviata.
Esistono più file di configurazione e script di compilazione che CRA utilizza per configurare un processo di compilazione webpack e Babel che include una configurazione di base di Jest per i test. Per semplificare le cose per l'utente, questi file sono nascosti e non è possibile accedervi finché non esci da CRA. È sempre meglio evitare l'estrazione, se possibile, poiché comporta l'assunzione di tutti questi file di configurazione come codice sorgente, che può diventare difficile da gestire.
La struttura di directory di una nuova applicazione CRA contiene solo i file che devi effettivamente modificare per lavorare all'applicazione. La documentazione CRA lo spiega nel dettaglio.
Passaggi successivi
Ora che sai come iniziare a creare un'app con Create React App, scopri come migliorare il rendimento e l'accessibilità della tua app con tutte le guide di questo percorso di apprendimento: