Hello World

Il più semplice esempio di React è questo:

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<h1>Hello, world!</h1>);

Questo codice mostra un’intestazione con scritto “Hello, world!” nella pagina.

Try it on CodePen

Clicca sul link in alto per aprire un editor online. Sentiti libero di effettuare modifiche e osservare come esse influenzano l’output. La maggior parte delle pagine in questa guida avrà esempi modificabili come questo.

Come leggere questa Guida

In questa guida, esamineremo i mattoni con cui si costruiscono le applicazioni con React: elementi e componenti. Una volta padroneggiati, potrai creare applicazioni complesse a partire da piccole parti riutilizzabili.

Consiglio

Questa guida è indirizzata a chi preferisce apprendere i concetti un passo alla volta. Se preferisci mettere subito le mani in pasta, dai un’occhiata al nostro tutorial pratico. Questa guida e il tutorial sono complementari.

Questo è il primo capitolo di una guida che illustra passo dopo passo tutti i principali concetti di React. Puoi trovare una lista di tutti i capitoli nel menu di navigazione a lato. Se stai leggendo questa pagina da un dispositivo mobile, puoi accedere al menu di navigazione premendo il bottone nell’angolo in basso a destra dello schermo.

Ogni capitolo di questa guida si fonda sulle nozioni introdotte nei capitoli precedenti. Puoi imparare la maggior parte di quello che c’è da sapere su React leggendo i capitoli dei “Concetti fondamentali” della guida, nell’ordine in cui appaiono nel menu di navigazione. Per esempio, “Introduzione al JSX” è il prossimo capitolo.

Conoscenze di base

React è una libreria JavaScript, quindi assumeremo che tu possieda una conoscenza base del linguaggio JavaScript. Se non ti senti sicuro, ti raccomandiamo di seguire un tutorial JavaScript per verificare il tuo livello di preparazione e consentirti di seguire questa guida senza perderti. Il tutorial dovrebbe richiedere da 30 a 60 minuti, ma ti eviterà la difficoltà di dover apprendere React e JavaScript contemporaneamente.

Note

Talvolta, questa guida utilizza negli esempi la sintassi JavaScript introdotta più di recente. Se non hai programmato in JavaScript negli ultimi anni, questi tre punti dovrebbero esserti sufficienti per incominciare.

Iniziamo!

Continua a scorrere verso il basso e troverai il link al prossimo capitolo di questa guida subito prima il footer del sito.