React und GraphQL (mit TypeScript)

Einführung in moderne Frontend-Anwendungen

• Vergleich von React, Vue und Angular
• Deklaratives Rendering
• Erstellung von benutzerdefinierten HTML-Tags mit Komponenten
• Initialisierung eines React-Projekts mit create-react-app

JavaScript für React (Grundlagen, falls notwendig)

• Entwicklung mit Node.js und npm
• JavaScript-Versionen und Neuerungen
• Modulmanagement (import und export)
• Verwendung von Pfeilfunktionen
• Funktionale Programmierung in JavaScript

TypeScript für React (Grundlagen)

• Statische vs. dynamische Typisierung
• Typdeklarationen für Variablen, Funktionen, Arrays und Objekte
• Grundlegende Datentypen
• Arbeiten mit Types und Interfaces

Verwalten des Anwendungszustands

• Deklaratives Rendering in React
• Verwendung des State-Hooks für Zustandverwaltung
• Erfassung von Input-Werten aus Formularen

JSX – Die React Templatesprache

• Erstellen von Templates mit JSX
• Binden von Inhalten und Props
• Eventhandler definieren
• Wiederholung von Elementen mit Schleifen
• Verwendung von if/else für bedingte Darstellung
• Styling mit CSS-Klassen

Komponenten in React

• Nutzung vorgefertigter Komponenten
• Komponentenbibliotheken für React
• Definition eigener React-Komponenten
• Handhabung von Props und Events in eigenen Komponenten
• Typisierung von Props, Events und State in TypeScript
• Datenfluss zwischen Komponenten
• Komponenteninspektion mit React Developer Tools

Abfragen von APIs in React

• HTTP-Requests mit fetch senden
• Verwendung des Effect-Hooks für das Auslösen von HTTP-Requests

Arbeiten mit Klassenkomponenten

• Definition von Komponenten als Funktion oder Klasse
• Verständnis der "this"-Referenz in JavaScript
• State-Management in Klassenkomponenten
• Handhabung von Props und Events in Klassenkomponenten

Werkzeuge und Bibliotheken in React

• React Router für Navigation
• Kontext API für die Datenweitergabe im Komponentenbaum
• Details zum Effect-Hook
• Nutzung externer und eigener Hooks (z.B. react-query)
• Styling-Bibliotheken in React
• Formular-Bibliotheken für Formulareingaben

State Management mit Reducern

• Überblick über State Management in React
• Verwendung von Reducern und reinen Funktionen
• Anwendung des Reducer-Hooks in React
• Überblick über State Management mit Redux

Testen und Komponentendemos

• Nutzung von Storybook für Komponenten-Demos
• Testen von JavaScript-Funktionen mit Jest
• Testen von React-Komponenten mit react-testing-library
• Durchführung von Snapshot-Tests

App-Entwicklung mit React

• Erstellung von Progressive Web Apps (PWA)
• Einführung in React Native für mobile Anwendungen

Performanceoptimierung und Pre-Rendering

• React Developer Tools Profiler verwenden
• Performanceoptimierungen mit React.memo, Callback-Hook und Memo-Hook
• Einsatz von Static Site Generators
• Serverseitiges Rendering und Code-Splitting

Einführung in GraphQL

• Einsatzgebiete und Vorteile von GraphQL
• GraphQL vs. REST
• Arbeiten mit dem GraphiQL Explorer
• Einfache GraphQL-Abfragen erstellen
• Parametrische Queries in GraphQL
• Arbeiten mit Mutationen
• Datenstrukturen in GraphQL
• Abfragen eines GraphQL-APIs aus JavaScript
• Integration von GraphQL in React-Anwendungen mit Apollo Client