Creați aplicația React, creați prima aplicație cu React Ubuntu 20.04

În articolul următor vom analiza cum putem crea prima noastră aplicație cu ReactJS pe Ubuntu 20.04 folosind Create React App. ReactJS este o bibliotecă JavaScript open source utilizată pentru a crea interfața cu utilizatorul, întreținută de Facebook și de comunitatea dezvoltatorilor. ReactJS poate fi utilizat în dezvoltarea de aplicații web sau aplicații mobile.

În React, cunoscut și sub numele de ReactJS, datele sunt procesate în DOM. Pentru a rula aplicația React sunt necesare biblioteci suplimentare pentru rutare și gestionarea stării. Câteva exemple ale acestor biblioteci sunt Redux y ReactRouter.

Instalarea React pe Ubuntu 20.04

Pentru a instala React pe sistemul nostru, trebuie mai întâi să știm ce este npm și să înțelegem de ce avem nevoie de ele. Npm înseamnă Node Package Managerși este cel mai mare registru de software open source din lume. Conține peste 800.000 de pachete de coduri. Npm este gratuit și orice software public poate fi descărcat și utilizat fără înregistrare sau autentificare.

Npm este un instrument de gestionare a dependenței pentru aplicațiile javascript, care ajută la instalarea tuturor bibliotecilor și a altor instrumente pentru a sprijini dezvoltarea aplicațiilor JS.

Instalați npm

la instalați nodejs, care include npm, va trebui doar să deschidem un terminal (Ctrl + Alt + T) și să executăm următoarea comandă:

sudo apt install nodejs

După terminarea instalării npm, putem verificați versiunea dvs. și cea a nodului. Putem face acest lucru cu comanda:

npm -v

Versiunea npm instalată depinde de data instalării, deoarece actualizarea se efectuează frecvent. Este necesar să ne asigurăm că avem instalată o versiune mai mare de 5.

la verificați versiunea instalată a nodului, comanda de utilizat va fi:

node -v

Dacă nu aveți instalată cea mai recentă versiune de npm pe sistemul dvs., puteți actualiza Node Package Manager (npm) la cea mai recentă versiune rularea acestei comenzi în terminal:

sudo npm install -g npm@latest

Instalați create-react-app

Pentru a instala un mediu productiv React, va trebui să configurăm instrumente precum babel, webpack, etc ... care este complex de configurat pentru începătorii din lumea React. Dar putem găsi mai multe instrumente care ne vor ajuta în configurare. Printre ele vom găsi create-react-app, care este cel mai simplu instrument de utilizat și configurat.

Aplicația Create React este un mediu confortabil pentru a învăța Reactși este cel mai bun mod de a începe să construiți o nouă aplicație cu o singură pagină folosind React.

Creați aplicația React, configurați-vă mediul de dezvoltare astfel încât să puteți utiliza cele mai recente caracteristici Javascript, oferind o experiență bună de dezvoltare și optimizând aplicația pentru producție. Așa cum este indicat pe site-ul lor web, este necesar să aveți Node> = 8.10 și npm> = 5.6 instalat pe computerul dvs.

Putem instalați create-react-app folosind npm. Pentru a face acest lucru, într-un terminal (Ctrl + Alt + T) va trebui doar să executăm următoarea comandă de instalare:

sudo npm install -g create-react-app

Odată ce instalarea aplicației create-react-app este terminată în sistemul nostru, putem verificați versiunea instalată executând următoarea comandă:

create-react-app --version

Crearea primei aplicații React

Prima noastră aplicație React poate fi creată pur și simplu utilizând create-react-app. Va trebui să folosim doar următoarea comandă:

create-react-app mi-primera-app

Comanda de mai sus va crea o aplicație React numită prima mea aplicație. În același timp va fi creat un nou folder cu același nume al aplicației care include toate fișierele, setările și bibliotecile necesare.

Rularea aplicației React

Odată ce proiectul React este creat, va trebui să ne mutăm în directorul proiectului și să rulăm aplicația React folosind următoarea comandă în terminal (Ctrl + Alt + T):

npm start

Comanda npm începe porniți serverul de dezvoltare care va efectua întregul proces de construire.

Terminalul ne va spune că trebuie deschideți browserul și încărcați aplicația care va rula la adresa URL http: // localhost: 3000 în mod implicit. Când browserul se deschide, vom vedea sigla React și textele pe ecran.

Dezinstalați create-react-app și npm

Utilizatorii putem dezinstala orice bibliotecă instalată din npm folosind comanda npm uninstall. Rulați următoarea comandă în terminal (Ctrl + Alt + T) pentru a dezinstala creați-reacþioneazã aplicație:

sudo npm uninstall -g create-react-app

În mod similar, putem dezinstalați npm folosind această altă comandă în același terminal:

sudo apt remove nodejs

Mai multe informații despre această bibliotecă JavaScript pentru crearea de interfețe de utilizator pot fi găsite în documentația proiectului.