So installieren Sie React.js mit der create-react-app

React ist heute eine der beliebtesten JavaScript-Bibliotheken im Bereich der Webentwicklung.

Als Frontend-Entwickler habe ich in meinen Projekten persönlich mit React gearbeitet und werde wahrscheinlich auch in Zukunft damit arbeiten. Einer der Schritte, mit denen viele Menschen zu kämpfen haben, ist der Installations- / Konfigurationsprozess von React.

Beginnen wir also mit den Grundlagen. In diesem Beitrag erfahren Sie, wie Sie eine React-Anwendung auf einfache Weise installieren und ausführen.

Da das Interesse am Lernen von React von Tag zu Tag rapide zunimmt, habe ich mich auch entschlossen, auf meinem YouTube-Kanal Video-Tutorials über React zu erstellen. Hier ist eine Videoversion dieses Tutorials:

Herunterladen und Installieren von Node.js.

Zunächst benötigen Sie NPM (oder alternativ Garn). Verwenden wir für dieses Beispiel NPM.

Wenn Sie es nicht auf Ihrem System installiert haben, müssen Sie die offizielle Node.js-Website aufrufen, um Node herunterzuladen und zu installieren, zu der auch NPM (Node Package Manager) gehört.

Wählen Sie die Schaltfläche "Für die meisten Benutzer empfohlen" und laden Sie die aktuelle Version für Ihr Betriebssystem herunter.

Nachdem Sie Knoten herunterzuladen und zu installieren, Ihr Terminal / Eingabeaufforderung starten und laufen node -vund npm -vzu sehen , welche Versionen Sie haben.

Ihre NPM-Version sollte mindestens 5.2.0 oder neuer sein, da für die Create-React-App NPX installiert sein muss. Wenn Sie eine ältere Version von NPM haben, führen Sie diesen Befehl aus, um sie zu aktualisieren:

npm install -g npm

Was ist eine Create-React-App?

Da es kompliziert ist und viel Zeit in Anspruch nimmt, möchten wir React nicht manuell konfigurieren. create-react-app ist eine viel einfachere Möglichkeit, alle Konfigurationen und erforderlichen Paketinstallationen automatisch für uns durchzuführen und eine neue React-App lokal zu starten, die für die Entwicklung bereit ist.

Ein weiterer Vorteil der Verwendung der Create-React-App besteht darin, dass Sie sich nicht mit Babel- oder Webpack-Konfigurationen befassen müssen. Alle notwendigen Konfigurationen werden von create-react-app für Sie vorgenommen.

Laut der React-Dokumentation ist die Create-React-App eine der offiziell unterstützten Möglichkeiten, um einseitige Anwendungen in React zu erstellen. Hier finden Sie andere Möglichkeiten.

So installieren Sie die Create-React-App

Um Ihre App zu installieren, gehen Sie zuerst zu Ihrem Arbeitsbereich (Desktop oder Ordner) und führen Sie den folgenden Befehl aus:

npx create-react-app my-app

Der Installationsvorgang kann einige Minuten dauern. Danach sollte ein Ordner in Ihrem Arbeitsbereich mit dem Namen angezeigt werden, den Sie Ihrer App gegeben haben.

Hinweis: Wenn Sie auf einem Mac arbeiten und Berechtigungsfehler erhalten, vergessen Sie nicht, zuerst mit dem Befehl sudo ein Superuser zu sein.

So führen Sie die mit Create-React-App erstellte App aus

Wechseln Sie nach Abschluss der Installation in das Verzeichnis, in dem Ihre App installiert wurde:

cd my-app

und schließlich ausführen npm start, um Ihre App live auf localhost zu sehen:

npm start

Wenn Sie so etwas in Ihrem Browser sehen, können Sie mit React arbeiten. Herzliche Glückwünsche! :) :)

Danke fürs Lesen!