Installazione di React.js su Mac

Il software è una libreria JavaScript front-end gratuita e open source. Nel 2013, React.JS è stata fondata da Facebook.

È una libreria dell'interfaccia utente (UI) utilizzata per creare e manipolare i componenti dell'interfaccia utente. È un pacchetto che consente agli sviluppatori di creare app SPA basate sui dati altamente efficienti.

Si basa sulla programmazione funzionale, si basa sul concetto di immutabilità e promuove un'architettura basata sui componenti basata sul principio di riutilizzabilità unica.

In questo articolo, esamineremo le procedure su come installare react su mac. Dopo aver completato le fasi di installazione, ti invitiamo a partecipare alla formazione React online.

Esploriamo alcuni termini prima-

NodeJS e NPM

• Devi prima installare NodeJS e NPM per ottenere l'installazione di React su Mac.
• È un motore JavaScript che ti consente di eseguirlo al di fuori del browser.
• NPM (gestore di pacchetti di nodi) viene utilizzato sulla riga di comando. Serve per installare librerie come ReactJS.
• Puoi installare NodeJS tramite il loro sito Web ufficiale. Quando installi NodeJS, scaricherà anche NPM per te.
• Dopo aver scaricato NodeJS dal loro sito Web, trova il file ".pkg". Basta fare doppio clic su questo. Verrà avviato un pop-up per l'installazione.
• Verrai indirizzato al processo di installazione. Fai clic su "Installa" o "Modifica posizione di installazione"
• Al termine del processo, verrà visualizzato un messaggio finale. NodeJS e NPM sono installati.

Installazione di ReactJS su MacOS

Dopo aver installato NodeJS e NPM, è possibile installare ReactJS. Viene eseguito eseguendo npm install- save react react-dom.

Crea progetto ReactJS

Poiché abbiamo installato ReactJS, è possibile creare una nuova directory del progetto react. Viene eseguito eseguendo npx create react project. creare-reagire-app.

Reagire- Introduzione

Prima di procedere con l'installazione di React-Lib sul Mac, dobbiamo prima acquisire una conoscenza di base di React.

• React è un pacchetto che aiuta gli sviluppatori web e gli architetti a soddisfare le aspettative dei clienti che richiedono un flusso di dati elevato e interfacce utente rapide e reattive nel contesto dei dati.
• È costruito su un'architettura basata su componenti. La pagina web può essere rappresentata dai componenti Genitore e Figlio.
• Si basa in gran parte su Virtual DOM, che funge da ottimizzatore di prestazioni per le operazioni DOM.
• Una pagina Web HTML ha un albero DOM, che il browser utilizza per eseguire il rendering della pagina Web.

Quando un utente interagisce con una pagina, comporta l'aggiunta e l'inserimento di informazioni in base all'azione dell'utente. come in Un utente ha aggiunto un articolo al carrello. Il carrello ora mostra l'articolo modificato a seguito della decisione dell'utente.

Dietro le quinte, il documento HTML subisce una trasformazione che consente la condivisione della pagina modificata.

Come affermato in precedenza, l'albero DOM rappresenta il documento HTML. Nel caso precedente, il DOM richiede alcuni aggiustamenti, che includono l'inserimento e la cancellazione di particolari nodi HTML.

Ciò aiuta a visualizzare le informazioni essenziali che simboleggiano ciò che un utente sta tentando di fare nel contesto della revisione del suo

decisione di acquisto.

Potremmo vedere il DOM come un albero per comprenderlo meglio.

L'albero ha radici e rami. Allo stesso modo, l'elemento HTML si trova nella parte superiore del DOM e i nodi sottostanti sono collegati al nodo padre. In termini di analogia ad albero, il nodo padre può essere rappresentato come il tronco, con altri nodi che si connettono al tronco. E React viene utilizzato per migliorare le operazioni di inserimento ed eliminazione su questi nodi.

C'è una penalità di memoria associata a questa operazione di inserimento ed eliminazione sul DOM HTML. In termini di operazioni di aggiornamento del DOM, il DOM virtuale funge da ottimizzatore delle prestazioni.

Ne conserva due copie: una del vero DOM (react DOM) e una degli aggiornamenti da fare. Anche il processo di riduzione al minimo delle modifiche sul DOM di reazione viene studiato come parte del processo di riconciliazione.

Node.js e npm

Node.js esegue il codice di JavaScript. È un ambiente di runtime open source e multipiattaforma per JavaScript. È alimentato dal motore Chrome V8. Il motore Chrome V8 è scritto in C++. Node è compatibile con Windows, Mac e Linux.

Dopo aver installato Node.js, potremmo eseguire l'app basata su React localmente sul nostro sistema durante lo sviluppo. Questo ci consente anche di distribuire il nostro programma sul server di produzione.

Node.js include le seguenti funzionalità:

• Usa JavaScript come linguaggio principale
• I/O non bloccanti
• Supporta la programmazione asincrona
• Può gestire numerose richieste di connessione utilizzando un unico server.

Npmjs.org è un repository di codice online di migliaia di moduli (npm) che ci consente di installare moduli di nodi utilizzando semplici comandi.

Alcuni moduli sono autonomi, mentre altri richiedono l'interdipendenza per funzionare correttamente.Node.js ci consente di condurre operazioni di lettura e scrittura sul server. Ti permette anche di lavorare con i database.

Invece di creare funzionalità da zero, possiamo cercare un modulo e riutilizzarne ed estenderne la funzionalità.

Le iniziative degli sviluppatori in genere comportano vincoli di tempo e budget. Quando si tratta di Node. sviluppo basato su js, npmjs.org è un'ancora di salvezza per la comunità di sviluppatori.

Per riassumere

In questo tutorial, abbiamo appreso di React.js e dell'approccio dell'architettura basata sui componenti in React.js. Abbiamo anche una panoramica di alto livello del DOM virtuale.

Abbiamo discusso il concetto di riconciliazione, l'uso di Node.js nel mondo di JavaScript e la sua capacità di gestire l'output di I/O non bloccante per soddisfare contemporaneamente le richieste di connessione del client.

Abbiamo testato due tecniche per l'installazione di Node.js: una con la gestione dei pacchetti e una con la riga di comando.

Per iniziare rapidamente a utilizzare React.js, abbiamo utilizzato il modulo create-react-app. Possiamo anche usare la riga di comando per installare React.js.

Per evitare di sovraccaricarci di troppi dettagli, abbiamo utilizzato la tecnica create-react-app per questo tutorial. Abbiamo visto la nostra prima app di reazione in esecuzione dopo averla sviluppata. Abbiamo valutato rapidamente i file importanti che utilizzano l'app per acquisire familiarità con il codice dal punto di vista dello sviluppo.

Leggi anche:

• I virus Mac sono vivi Uccidili e abita nella tranquillità!