Die JavaScript Bibliothek React lässt sich wunderbar mit TypeScript programmieren. Dafür kann ein neues Projekt mit der “Create React App” CLI entwickelt werden oder auch ein bestehendes Projekt auf TypeScript migriert werden.
TypeScript ist ein Superset von JavaScript – die Verwendung von TypeScript bietet verschiedene Vorteile:
- Optionales Static Typing
- Type Interfaces, die einige Vorteile von Typen bieten, ohne sie tatsächlich zu verwenden
- Zugriff auf moderne ES Funktionen, bevor sie von den gängigen Browsern unterstützt werden
- Die Möglichkeit, den Code auf eine JavaScript Version zu kompilieren, die auf allen Browsern läuft
- Sehr gute IntelliSense Unterstützung
Zur Erstellung eines neuen Projektes mittels “Create React App”, die folgenden Commands im Terminal verwenden:
Create React App CLI – neues Projekt generieren:
npx create-react-app demo-app --template typescriptEin bestehendes React JavaScript Projekt kann um die notwendigen Types mit z.B. node package manager erweitert werden. Dafür im Terminal im Projektverzeichnis den folgenden Command z.B mit npm verwenden:
npm add typescript @types/react @types/react-dom @types/nodeAnschließend muss die App.jsx auf App.tsx umbenannt werden.
Die App kann dann einfach mittels NPM am Development Server gestartet werden:
npm startHappy Coding!