Zeile 34: |
Zeile 34: |
| * [https://stackoverflow.com/questions/38033442/big-list-performance-with-react Darstellen langer Listen mit React] | | * [https://stackoverflow.com/questions/38033442/big-list-performance-with-react Darstellen langer Listen mit React] |
| * [https://github.com/bvaughn/react-virtualized React-virtualized - Modul zum Anzeigen von Daten erst dann, wenn der Benutzer dies will] | | * [https://github.com/bvaughn/react-virtualized React-virtualized - Modul zum Anzeigen von Daten erst dann, wenn der Benutzer dies will] |
| + | |
| + | == Beispiel für TypeScript und React == |
| + | |
| + | === Grundlegendes === |
| + | |
| + | Ein Projekt sollte ein Versionskontrollsystem nutzen. |
| + | Ein früherer Zustand des Projekts sollte wiederhergestellt werden können. Zu diesem Zustand gehören grundsätzlich auch die Abhängigkeiten (wie externe Programmierbibliotheken). |
| + | |
| + | Die folgenden Kommandozeilen setzen die [[Bash]] unter [[Linux]] oder [[MacOS]] voraus. Vieles davon dürfte - evtl. leicht modifiziert - auch auf [[Windows]] laufen. |
| + | |
| + | === Installation von node === |
| + | |
| + | [[Node.js]] kommt zwar mit der Linux-Distribution, aber wir wollen - um möglichst alle Abhängigkeiten zu definieren - mit Hilfe von [[nvm]] eine spezifische Node-Version installieren: |
| + | |
| + | Im Terminal nvm-Repo klonen: |
| + | cd ~ |
| + | git clone https://github.com/creationix/nvm.git .nvm |
| + | cd .nvm |
| + | |
| + | Folgende Zeilen an die <code>~/.bashrc</code> anfügen: |
| + | |
| + | export NVM_DIR="$HOME/.nvm" |
| + | [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm |
| + | [ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion |
| + | |
| + | |
| + | Im Terminal node-LTS herunterladen und als Standard setzen: |
| + | nvm install 'lts/*' |
| + | nvm alias default 'lts/*' |
| + | |
| + | === Projekt initialisieren === |
| + | |
| + | Projektverzeichnis erstellen und für GIT initialisieren: |
| + | export PROJ_DIR=~/myprojects/myfrontend |
| + | mkdir "$PROJ_DIR" |
| + | cd "$PROJ_DIR" |
| + | git init |
| + | |
| + | React-App-Verzeichnis erstellen |
| + | cd "PROJ_DIR" |
| + | create-react-app myapp |
| + | |
| + | TypeScript hinzufügen: |
| + | npm install --save typescript @types/node @types/react @types/react-dom @types/jest |
| + | |
| + | |
| + | |
| + | |
| | | |
| -------- | | -------- |