Skip to content

Latest commit

 

History

History
96 lines (61 loc) · 4.42 KB

INSTALL_online-graphql.md

File metadata and controls

96 lines (61 loc) · 4.42 KB
Raw

Vorbereitungen für die React Online Schulung

Voraussetzungen

Für dein Laptop/PC

Auf deinem Laptop/PC sollte installiert sein:

  • Git (zum installieren des Workspaces)
  • NodeJS Version 16.x (vielleicht gehen auch vorherige Versionen, wenn die Installation unten klappt, dann ist alles gut) und die darin enthaltene npm Version
  • Browser (am besten Firefox oder Chrome)
  • Eine IDE oder ein Texteditor. Wenn Du bereits einen "Lieblingseditor" verwendest, benutze diesen während des Trainings, damit Du nicht auch noch ein neues Tool lernen musst. Ansonsten funktionieren folgende Tools zum Beispiel:
  • Für Schulungen, die wir über Zoom machen: bitte den Zoom Client installieren (und nicht die Web-Version von Zoom verwenden). Du benötigst aber keinen Zoom-Account.

Optional: Browser Erweiterungen für React

  • Für das Arbeiten mit React empfehle ich, die React Developer Tools zu installieren. Es gibt sie für Chrome und Firefox. Für den Workshop sind die Developer Tools nicht notwendig.

Während des Trainings

  • Da wir vor und während des Trainings ggf. noch Aktualisierungen installieren müssen, bitte sicherstellen, dass auch während des Trainings auf deinem Computer der Internet-Zugang (logisch, online-Schulung 🙃) funktioniert - und zwar auch für git und npm (Proxies beachten!)
    • Informationen zum Einrichten eines Proxies für npm findest Du bei Bedarf zum Beispiel hier.
  • Bitte schalte während des Trainings deine Kamera an, damit wir uns sehen können 🎥. Mikrofon hingegen bitte nur anmachen, wenn Du etwas sagen oder fragen möchtest (was Du natürlich jederzeit darfst!)
  • W-LAN ist bequem, aber gerade bei (langen) Streamings ist ein Kabel-gebundenes Netzwerk stabiler als W-LAN, also im Zweifel lieber das Kabel einstecken (und W-LAN deaktivieren) 😊

Installation und Vorbereitung des Workspaces für die Schulung

Damit wir sicher sind, dass während des Workshops alles funktioniert, möchte ich dich bitten, im Vorweg schon einmal die folgenden Schritte durchzuführen, auch wenn es während des Workshops möglicherweise noch ein Update gibt (deswegen bitte sicherstellen, dass git und npm auch während des Workshops funktionieren).

Schritt 1: Repository klonen und Pakete installieren

  1. Das Repository klonen:
git clone https://github.com/nilshartmann/react18-training
  1. Die benötigten npm-Pakete installieren:
cd blog-example/backend-rest
npm install

cd blog-example/backend-graphql
npm install

cd blog-example/workspace
npm install

cd blog-example/workspace-typescript
npm install

cd blog-example/workspace-graphql
npm install

Schritt 2: Testen, ob REST-Backend funktioniert

  1. Im Verzeichnis blog-example/backend-rest des Repositories das Backend starten:
cd blog-example/backend-rest
npm start

Achtung! Das Backend läuft auf Port 7000, d.h. dieser Port muss verfügbar sein.

  1. REST Backend testen

Schritt 3: Testen, ob der Frontend-Workspace funktioniert

  1. Frontend (Beispiel-Anwendung) starten

Dazu in das Verzeichnis blog-example/workspace wechseln und npm start ausführen:

cd blog-example/workspace

npm start

Achtung! Das Frontend läuft auf Port 3000, d.h. dieser Port muss verfügbar sein.

  1. Wenn das Frontend gestartet ist, zum testen einmal die Anwendung im Browser aufrufen: http://localhost:3000. Dort sollte "Hello, World" erscheinen, dann ist der Workspace einsatzbereit.

Running frontend

Das ist alles 😊

Bei Fragen oder Problemen melde dich gerne bei mir.