Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lernen Projekt Starten | React in der Realen Welt
React-Meisterschaft
course content

Kursinhalt

React-Meisterschaft

React-Meisterschaft

2. Styling in React Apps
3. React Hooks und Context
4. React in der Realen Welt

book
Projekt Starten

Schritt 6: Initialisieren Sie das Projekt

Um das Projekt zu starten, verwenden wir das Terminal. Befolgen Sie diese Schritte:

  • Öffnen Sie das Terminal in Ihrem Code-Editor (falls noch nicht geöffnet);
  • Führen Sie den folgenden Befehl aus und drücken Sie Enter:

Der Befehl npx wird verwendet, um das Paket create-react-app auszuführen, ohne es global installieren zu müssen. Der Punkt (.) am Ende gibt an, dass das Projekt im aktuellen Verzeichnis eingerichtet werden soll.

Hinweis

Die Initialisierung des Projekts kann einige Zeit in Anspruch nehmen. Lassen Sie Ihre Maschine den Einrichtungsprozess durchführen.

Wenn es fertig ist, sehen Sie die Nachricht im Terminal: Happy hacking!.

Zusätzlich zur Bestätigungsnachricht hat das Projektstammverzeichnis die folgende Struktur:

Schritt 7: Anpassen beginnen

Mit dem eingerichteten Projekt ist es an der Zeit, mit dem Codieren und Anpassen nach Ihren Bedürfnissen zu beginnen. Hier ist, was Sie wissen müssen:

  • Ihr Hauptfokus wird im src-Ordner liegen;
  • Im src-Ordner finden Sie verschiedene Dateien. Um Ihr persönliches Projekt zu erstellen, können Sie alle davon löschen;
  • Folgen Sie der Projektarchitektur, die Sie in CodeSandbox verwendet haben. Erstellen Sie eine index.js-Datei als Haupteinstiegspunkt und bauen Sie das gesamte Projekt in App.jsx auf;
  • Organisieren Sie Ihre Komponenten und Stile, indem Sie bei Bedarf neue Ordner erstellen.

Schritt 8: Sehen Sie Ihr Projekt an

Um die Live-Seite Ihres Projekts anzuzeigen, führen Sie den folgenden Befehl im Terminal aus und drücken Sie Enter:

Dies wird Ihre React-App starten, und Sie können darauf in Ihrem Webbrowser zugreifen.

Welchen Befehl verwenden wir, um die React-App zu erstellen?

Welchen Befehl verwenden wir, um die React-App zu erstellen?

Wählen Sie die richtige Antwort aus

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 4. Kapitel 5
We're sorry to hear that something went wrong. What happened?
some-alt