Il modo più veloce per creare un'applicazione di prova con ReactJS è quello di creare una pagina HTML all'interno della quale renderizziamo un component. Per creare un component dobbiamo semplicemente creare una funzione che al suo interno restituisca un tag HTML da renderizzare. Successivamente usiamo il metodo render della classe ReactDOM. per renderizzare questo tag all'interno della pagina.
<html> <head></head> <body> Hello world in ReactJS <div id="example"></div> </script> </body> </html>
function HelloWorld() { return ( <div> Hello World from reactJS </div> ); } ReactDOM.render( <HelloWorld />, document.getElementById('example') );
In quesoto snippet ci sono diverse cose da notare. La prima è che il metodo HelloWorld utilizza la sintassi JSX per esprimere il codice HTML che deve renderizzare. La seconda è che nel metodo render utilizziamo la funziona come se fosse un tag HTML. Anche questa sintassi è JSX in quando una funzione che torna HTML e che ha la prima lettera maiuscola può essere come tag. Ovviamente, il browser non è in grado di interpretare la sintassi JSX, quidni il javascript va prima preprocessato con transpiler come TypeScript o Babel.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Utilizzare Tailwind CSS all'interno di React: primi componenti
Elencare le container images installate in un cluster di Kubernetes
Come migrare da una form non tipizzata a una form tipizzata in Angular
Disabilitare automaticamente un workflow di GitHub (parte 2)
Definire stili a livello di libreria in Angular
Modificare i metadati nell'head dell'HTML di una Blazor Web App
Ottimizzare le performance delle collection con le classi FrozenSet e FrozenDictionary
Effettuare lo stream della risposta in ASP.NET Core tramite IAsyncEnumerable
Sfruttare lo streaming di una chiamata Http da Blazor
Usare il versioning con i controller di ASP.NET Core Web API
Accesso sicuro ai secrets attraverso i file in Azure Container Apps
Personalizzare l'errore del rate limiting middleware in ASP.NET Core