Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lernen Organisation der Projektordnerstruktur | Strukturierung von React-Projekten für den Praxiseinsatz
React Mastery

bookOrganisation der Projektordnerstruktur

Schritt 3: Erstellen des Projektordners

Nachdem alle notwendigen externen Tools vorhanden sind, kann mit der Erstellung des Projekts begonnen werden. Die Aufgabe besteht darin, einen neuen, leeren Ordner speziell für das Projekt anzulegen, in dem nichts anderes gespeichert wird.

Vorgehensweise:

  1. Ort wählen: Einen Speicherort auf dem Rechner auswählen, an dem der Projektordner erstellt werden soll. Dies kann beispielsweise der Desktop oder ein bestimmtes Verzeichnis sein;
  2. Neuen Ordner erstellen: Im gewählten Verzeichnis mit der rechten Maustaste klicken und im Kontextmenü "Neuer Ordner" auswählen;
  3. Ordner benennen: Dem Ordner einen aussagekräftigen Namen geben. Dieser dient als Wurzelordner für das React-Projekt, daher sollte ein informativer und relevanter Name entsprechend dem Zweck des Projekts gewählt werden. Zum Beispiel kann er movies-app, store-app, posts-app, learning-system-app usw. heißen.

Zum Beispiel erstellen wir den leeren Ordner mit dem Namen movies-app.

Schritt 4: Öffnen des Ordners im Code-Editor

Um mit der Arbeit am Projekt zu beginnen, muss der Ordner movies-app im Code-Editor geöffnet werden, unabhängig davon, ob Visual Studio Code oder ein anderer Editor verwendet wird.

Folgende Schritte ausführen:

  • Den Code-Editor starten. In unserem Beispiel wird Visual Studio Code (VS Code) verwendet;
  • Auf das Explorer-Symbol in der oberen linken Ecke der VS Code-Oberfläche klicken;
  • Klicken Sie auf die Schaltfläche "Ordner öffnen" im Explorer-Bereich;
  • Suchen Sie den Ordner movies-app auf dem Rechner und wählen Sie ihn aus. Nach Abschluss dieser Schritte sollte der Ordnername movies-app in der Oberfläche Ihres Code-Editors angezeigt werden.

Nachdem Ihr Projektordner eingerichtet und im Code-Editor geöffnet wurde, können Sie mit dem Aufbau Ihrer React-Anwendung beginnen!

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 4. Kapitel 3

Fragen Sie AI

expand

Fragen Sie AI

ChatGPT

Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen

Awesome!

Completion rate improved to 2.17

bookOrganisation der Projektordnerstruktur

Swipe um das Menü anzuzeigen

Schritt 3: Erstellen des Projektordners

Nachdem alle notwendigen externen Tools vorhanden sind, kann mit der Erstellung des Projekts begonnen werden. Die Aufgabe besteht darin, einen neuen, leeren Ordner speziell für das Projekt anzulegen, in dem nichts anderes gespeichert wird.

Vorgehensweise:

  1. Ort wählen: Einen Speicherort auf dem Rechner auswählen, an dem der Projektordner erstellt werden soll. Dies kann beispielsweise der Desktop oder ein bestimmtes Verzeichnis sein;
  2. Neuen Ordner erstellen: Im gewählten Verzeichnis mit der rechten Maustaste klicken und im Kontextmenü "Neuer Ordner" auswählen;
  3. Ordner benennen: Dem Ordner einen aussagekräftigen Namen geben. Dieser dient als Wurzelordner für das React-Projekt, daher sollte ein informativer und relevanter Name entsprechend dem Zweck des Projekts gewählt werden. Zum Beispiel kann er movies-app, store-app, posts-app, learning-system-app usw. heißen.

Zum Beispiel erstellen wir den leeren Ordner mit dem Namen movies-app.

Schritt 4: Öffnen des Ordners im Code-Editor

Um mit der Arbeit am Projekt zu beginnen, muss der Ordner movies-app im Code-Editor geöffnet werden, unabhängig davon, ob Visual Studio Code oder ein anderer Editor verwendet wird.

Folgende Schritte ausführen:

  • Den Code-Editor starten. In unserem Beispiel wird Visual Studio Code (VS Code) verwendet;
  • Auf das Explorer-Symbol in der oberen linken Ecke der VS Code-Oberfläche klicken;
  • Klicken Sie auf die Schaltfläche "Ordner öffnen" im Explorer-Bereich;
  • Suchen Sie den Ordner movies-app auf dem Rechner und wählen Sie ihn aus. Nach Abschluss dieser Schritte sollte der Ordnername movies-app in der Oberfläche Ihres Code-Editors angezeigt werden.

Nachdem Ihr Projektordner eingerichtet und im Code-Editor geöffnet wurde, können Sie mit dem Aufbau Ihrer React-Anwendung beginnen!

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 4. Kapitel 3
some-alt