Share
Was Sie erstellen werdenReact hat sich schnell zu einem beliebten Rahmen für die Erstellung von Ansichten auf Client- und Serverseite entwickelt. Es gab eine höhere Eintrittsbarriere beim Tooling sowie etwas Frustration bei der Ermüdung von JavaScript aus der Community. Die Create-React-App wurde entwickelt, um diesen Frustrationen entgegenzuwirken.
Sie müssen zunächst sicherstellen, dass auf Ihrem System Node installiert ist. Sie müssen mindestens Node Version 4 installiert haben. Sie empfehlen jedoch Version 6 für schnellere Downloads und eine bessere Festplattennutzung. Sie können nvm verwenden, um auch einfach zwischen den Knotenversionen zu wechseln.
Nachdem Sie Node installiert haben, sollten Sie Ihr bevorzugtes Befehlszeilentool öffnen und die create -react-App global installieren, damit Sie sie überall auf Ihrem System ausführen können.
npm install -g create -react-app
Öffnen Sie zunächst die Befehlszeile und navigieren Sie oder erstellen Sie ein Verzeichnis, in dem Sie Ihre Entwicklung durchführen. Als Nächstes erstellen wir die App durch Ausführen Erstellen-Reagieren-App Tuts-Plus-Reakt-App. Dadurch wird das CLI-Tool ausgeführt, um unsere Tuts-Plus-React-App zu erstellen.
Sobald das CLI-Tool abgeschlossen ist, gelangen Sie zu einem Übersichtsbildschirm, auf dem Sie wissen, wo die App erstellt wurde, und eine Liste der Befehle angezeigt, die Sie verwenden können.
Als Nächstes möchten Sie durch Ausführen zu unserer neuen App navigieren CD Tuts-Plus-Reakt-App.
Sie können die App lokal ausführen, indem Sie sie ausführen npm starten. Sobald die App gestartet ist, werden Sie in Ihrem Browser automatisch zu http: // localhost: 3000 / navigiert und sehen Ihre neue React-Anwendung.
Die App verwendet Webpack, um einen lokalen Dev-Server auszuführen. Es gibt eine Überwachungsfunktion. Wenn Sie also Ihren React-Code bearbeiten und speichern, werden die Änderungen automatisch im Browser angezeigt.
Wenn Sie mit Ihrem Code Fehler machen, werden diese Fehler oder Warnungen im Browser angezeigt.
ESLint ist enthalten, um sicherzustellen, dass Ihr Code gängigen Codestilen folgt. Auf diese Weise können Sie sicherstellen, dass Ihr Code konsistent ist. Dies ist besonders hilfreich, wenn mehrere Projektmitarbeiter mitwirken. Ich würde vorschlagen, es zu verwenden, wenn Sie neu in React sind, um gute React- und JavaScript-Codierstile zu lernen.
Wenn Sie mit dem Schreiben von Tests für Ihren Code vertraut sind, ist Jest für die Ausführung von Tests enthalten. Jest ist ein Test-Framework, das von Facebook, den Machern von React, erstellt und verwaltet wird. Um Ihre Tests auszuführen, führen Sie sie aus npm test in Ihrem Befehlszeilenprogramm. Dadurch werden die Tests ausgeführt und ein Watcher gestartet, der die Tests ausführt, wenn sich der Produktionscode ändert. Es gibt eine vorhandene Testdatei, die Sie hinzufügen können src / App.test.js.
Wenn Sie alle Änderungen vorgenommen haben, können Sie Ihre App bereitstellen. Alles was Sie tun müssen, ist die Ausführung npm run build in Ihrem Apps-Verzeichnis. Dies wird Babel verwenden, um Ihren React-Code in Code umzuwandeln, den der Browser versteht. Der Code wird auch minimiert, um sicherzustellen, dass Sie die beste Leistung im Browser haben.
Wenn Sie sich dazu entschließen, die Create-React-App weiter zu verwenden, würde ich Ihnen empfehlen, Zeit mit dem Lesen der Bedienungsanleitung zu verbringen. Es enthält viele nützliche Informationen zu anderen Ansichtsthemen, z. B. Hinzufügen von CSS-Stylesheets, Importieren anderer Komponenten, Importieren von Bildern und Schriftarten und anderen. Es enthält auch Informationen zu Webentwicklungsmethoden, z. B. die Verwendung von HTTPS, das Herstellen einer Verbindung zu einem Node-Back-End, das Erstellen progressiver Webanwendungen und vieles mehr.
Es gibt auch eine umfangreiche Dokumentation zum Testen und Bereitstellen Ihrer Anwendung.
Ich hoffe, Sie können jetzt sehen, wie einfach es ist, eine React-Anwendung mit dem create -react-app-Projekt zu erstellen. Ich hoffe, dass dies hilft, die Eintrittsbarriere zu senken und Sie mit React beginnen können. Ich weiß, dass du es genießen wirst!
Accentsconagua