React App erstellen, erstellen Sie Ihre erste Anwendung mit React Ubuntu 20.04

Im nächsten Artikel werden wir einen Blick darauf werfen Wie können wir unsere erste Anwendung mit ReactJS unter Ubuntu 20.04 mit Create React App erstellen?. ReactJS ist eine Open-Source-JavaScript-Bibliothek zum Erstellen der Benutzeroberfläche, die von Facebook und der Entwickler-Community verwaltet wird. ReactJS kann bei der Entwicklung von Webanwendungen oder mobilen Anwendungen verwendet werden.

In React, auch bekannt als ReactJSwerden die Daten im DOM verarbeitet. Zusätzliche Bibliotheken für das Routing und die Statusverwaltung sind erforderlich, um die React-Anwendung auszuführen. Einige Beispiele für diese Bibliotheken sind Redux y Router reagieren.

React unter Ubuntu 20.04 installieren

Um React auf unserem System zu installieren, müssen wir zuerst wissen, was npm ist und verstehen, warum wir sie benötigen. Npm steht für Node Package Managerund ist die weltweit größte Open-Source-Softwareregistrierung. Enthält mehr als 800.000 Codepakete. Die Verwendung von Npm ist kostenlos und jede öffentliche Software kann ohne Registrierung oder Anmeldung heruntergeladen und verwendet werden.

Npm ist ein Tool zur Abhängigkeitsverwaltung für Javascript-AnwendungenDies hilft bei der Installation aller Bibliotheken und anderer Tools, um die Entwicklung der JS-Anwendungen zu unterstützen.

Installieren Sie npm

zu Installieren Sie nodejs, einschließlich npmmüssen wir nur ein Terminal öffnen (Strg + Alt + T) und den folgenden Befehl ausführen:

sudo apt install nodejs

Nach Abschluss der npm-Installation können wir Überprüfen Sie Ihre Version und die des Knotens. Wir können dies mit dem Befehl tun:

npm -v

Die installierte Version von npm hängt vom Installationsdatum ab, da das Update häufig durchgeführt wird. Es ist notwendig, dass wir sicherstellen, dass eine Version höher als 5 installiert ist.

zu Überprüfen Sie die installierte Version des KnotensDer zu verwendende Befehl lautet:

node -v

Wenn Sie nicht die neueste Version von npm auf Ihrem System installiert haben, Sie können Node Package Manager (npm) auf die neueste Version aktualisieren Ausführen dieses Befehls im Terminal:

sudo npm install -g npm@latest

Installieren Sie die Create-React-App

Um eine produktive React-Umgebung zu installieren, müssen wir Tools wie babel, webpack usw. konfigurieren, deren Konfiguration für Anfänger in der React-Welt komplex ist. Wir können jedoch verschiedene Tools finden, die uns bei der Konfiguration helfen. Unter ihnen werden wir finden create-react-app, das am einfachsten zu verwendende und zu konfigurierende Tool.

Create React App ist eine komfortable Umgebung zum Erlernen von Reactund es ist der beste Weg, um mit React eine neue App für eine einzelne Seite zu erstellen.

Create React App Konfigurieren Sie Ihre Entwicklungsumgebung Damit können Sie die neuesten Javascript-Funktionen verwenden, eine gute Entwicklungserfahrung bieten und Ihre Anwendung für die Produktion optimieren. Wie auf der Website angegeben, muss Node> = 8.10 und npm> = 5.6 auf Ihrem Computer installiert sein.

Wir können installiere create-react-app mit npm. Dazu müssen wir in einem Terminal (Strg + Alt + T) nur den folgenden Installationsbefehl ausführen:

sudo npm install -g create-react-app

Sobald die Installation der App "Create-React-App" in unserem System abgeschlossen ist, können wir Überprüfen Sie die installierte Version Ausführen des folgenden Befehls:

create-react-app --version

Erstellen der ersten React-Anwendung

Unsere erste React-App kann einfach mit der Create-React-App erstellt werden. Wir müssen nur den folgenden Befehl verwenden:

create-react-app mi-primera-app

Mit dem obigen Befehl wird eine React-Anwendung namens aufgerufen meine erste App. Gleichzeitig Es wird ein neuer Ordner mit demselben Namen der Anwendung erstellt, der alle erforderlichen Dateien, Konfigurationen und Bibliotheken enthält.

Ausführen der React-App

Sobald das React-Projekt erstellt wurde, Wir müssen in das Projektverzeichnis wechseln und die React-Anwendung mit dem folgenden Befehl ausführen im Terminal (Strg + Alt + T):

npm start

Der Befehl npm starten Starten Sie den Entwicklungsserver, der den gesamten Erstellungsprozess ausführt.

Das Terminal wird uns sagen, dass wir müssen Öffnen Sie den Browser und laden Sie die Anwendung, die standardmäßig unter der URL http: // localhost: 3000 ausgeführt wird. Wenn der Browser geöffnet wird, werden das React-Logo und die Texte auf dem Bildschirm angezeigt.

Deinstallieren Sie create-react-app und npm

Benutzer Mit dem Befehl npm uninstall können wir jede von npm installierte Bibliothek deinstallieren. Führen Sie den folgenden Befehl im Terminal aus (Strg + Alt + T), um die Deinstallation durchzuführen Erstellen-Reagieren-App:

sudo npm uninstall -g create-react-app

Ebenso können wir deinstalliere npm Verwenden dieses anderen Befehls im selben Terminal:

sudo apt remove nodejs

Weitere Informationen zu dieser JavaScript-Bibliothek zum Erstellen von Benutzeroberflächen finden Sie in der Projektdokumentation.