## Einführung
ReactJS ist eine beliebte JavaScript-Bibliothek zum Erstellen von Benutzeroberflächen. Es verwendet eine komponentenbasierte Architektur, die die Erstellung komplexer und interaktiver Anwendungen erleichtert. In diesem Tutorial zeigen wir Ihnen, wie Sie ReactJS auf Ubuntu 20.04 LTS (Focal Fossa) installieren.
Voraussetzungen
Bevor Sie beginnen, benötigen Sie Folgendes:
* Ein Computer mit Ubuntu 20.04 LTS.
* Ein Texteditor (z. B. nano oder vi).
* Ein Terminalemulator (z. B. GNOME Terminal oder Konsole).
Schritt 1:Node.js installieren
Für die Ausführung von ReactJS ist Node.js erforderlich. Führen Sie die folgenden Schritte aus, um Node.js zu installieren:
1. Öffnen Sie einen Terminalemulator.
2. Aktualisieren Sie den Paketindex:
„
Sudo apt-Update
„
3. Installieren Sie Node.js:
„
sudo apt installiere nodejs
„
Schritt 2:NPM installieren
npm ist der Paketmanager für Node.js. Führen Sie die folgenden Schritte aus, um npm zu installieren:
1. Öffnen Sie einen Terminalemulator.
2. NPM installieren:
„
Sudo apt install npm
„
Schritt 3:Erstellen Sie ein ReactJS-Projekt
Um ein neues ReactJS-Projekt zu erstellen, gehen Sie folgendermaßen vor:
1. Öffnen Sie einen Terminalemulator.
2. Navigieren Sie zu dem Verzeichnis, in dem Sie das Projekt erstellen möchten:
„
cd ~/Projekte
„
3. Führen Sie den folgenden Befehl aus, um ein neues Projekt zu erstellen:
„
npx create-react-app meine-app
„
Dadurch wird ein neues Verzeichnis namens „my-app“ erstellt, das alle notwendigen Dateien für ein ReactJS-Projekt enthält.
Schritt 4:Starten Sie den Entwicklungsserver
Um den Entwicklungsserver zu starten, gehen Sie folgendermaßen vor:
1. Öffnen Sie einen Terminalemulator.
2. Navigieren Sie zum Projektverzeichnis:
„
cd ~/projects/my-app
„
3. Führen Sie den folgenden Befehl aus, um den Entwicklungsserver zu starten:
„
npm-Start
„
Dadurch wird der Entwicklungsserver auf Port 3000 gestartet. Sie können jetzt Ihren Webbrowser öffnen und zu „localhost:3000“ navigieren, um die ReactJS-Anwendung anzuzeigen.
Schritt 5:Bearbeiten Sie die App
Der Quellcode für die ReactJS-Anwendung befindet sich im Verzeichnis „src“. Die Hauptkomponente der Anwendung ist die Datei „App.js“. Sie können diese Datei bearbeiten, um das Aussehen und die Funktionsweise der Anwendung zu ändern.
Um beispielsweise den Titel der Anwendung zu ändern, können Sie die Datei „App.js“ bearbeiten und die folgende Zeile ändern:
„
„
zu Folgendem:
„
„
Dadurch wird der Titel der Anwendung in „Hello, World!“ geändert.
Schritt 6:Erstellen Sie die Anwendung
Wenn Sie bereit sind, die ReactJS-Anwendung bereitzustellen, können Sie sie für die Produktion erstellen, indem Sie den folgenden Befehl ausführen:
„
npm run build
„
Dadurch wird ein „Build“-Verzeichnis erstellt, das alle notwendigen Dateien für die Produktionsversion der Anwendung enthält.
Schritt 7:Stellen Sie die Anwendung bereit
Der Bereitstellungsprozess für eine ReactJS-Anwendung hängt von der Hosting-Plattform ab, die Sie verwenden. Weitere Informationen finden Sie in der Dokumentation Ihrer Hosting-Plattform.
Schlussfolgerung
In diesem Tutorial haben wir Ihnen gezeigt, wie Sie ReactJS auf Ubuntu 20.04 LTS (Focal Fossa) installieren. Wir haben Ihnen auch gezeigt, wie Sie eine einfache ReactJS-Anwendung erstellen und den Code bearbeiten, um sein Aussehen und seine Funktionalität zu ändern.
