Reaktions-Tutorial

Lernen durch Beispiele

Unser „Show React“-Tool macht es einfach, React zu demonstrieren. Es zeigt sowohl den Code als auch das Ergebnis.

import React from 'react';
import ReactDOM from 'react-dom';

function Hello(props) {
  return <h1>Hello World!</h1>;
}

ReactDOM.render(<Hello />, document.getElementById('root'));

Lernen durch Übungen

ReactDOM.(myElement, document.getElementById('root'));

Reagieren Quiz

Testen Sie Ihre Reaktionsfähigkeiten mit einem Quiz.

Reagieren Quiz

React-App erstellen

Um React zu lernen und zu testen, sollten Sie eine React-Umgebung auf Ihrem Computer einrichten.

Dieses Tutorial verwendet die create-react-app.

Das create-react-appTool ist eine offiziell unterstützte Möglichkeit, React-Anwendungen zu erstellen.

Node.js ist erforderlich, um create-react-app.

Öffnen Sie Ihr Terminal in dem Verzeichnis, in dem Sie Ihre Anwendung erstellen möchten.

Führen Sie diesen Befehl aus, um eine React-Anwendung mit dem Namen zu erstellen my-react-app:

create-react-apprichtet alles ein, was Sie zum Ausführen einer React-Anwendung benötigen.

Führen Sie die React-Anwendung aus

Führen Sie diesen Befehl aus, um in das my-react-appVerzeichnis zu wechseln:

Führen Sie diesen Befehl aus, um die React-Anwendung auszuführen my-react-app:

Ein neues Browserfenster mit Ihrer neu erstellten React-App wird angezeigt! Wenn nicht, öffnen Sie Ihren Browser und geben Sie localhost:3000in die Adressleiste ein.

Das Ergebnis:

was du bereits wissen solltest

Bevor Sie mit React.JS beginnen, sollten Sie über Zwischenerfahrung in folgenden Bereichen verfügen:

• HTML
• CSS
• JavaScript

Sie sollten auch etwas Erfahrung mit den neuen JavaScript-Funktionen haben, die in ECMAScript 6 (ES6) eingeführt wurden, Sie werden darüber im Kapitel React ES6 erfahren.