React.js: Einführung in React.js

Name: React.js: Einführung in React.js
Author: Tony Davydets

In diesem Kurs lernen Sie, was React ist und warum es ein leistungsfähiges Werkzeug für die Erstellung von Benutzeroberflächen ist. Sie lernen die Vorteile von…

Preview the first lesson free — get full access to all 1 lessons.

Demo anfragen Anmelden

Kurs: On-Demand

Hallo, mein Name ist Tony und ich bin dabei. In diesen Lektionen erfahren Sie, warum Sie React gegenüber Plain wählen JavaScript in HTML und erstellen Sie mit Erstellen eine neue React-App React-App-Dienstprogramm. In dieser Lektion werfen wir einen Blick darauf, was React wirklich ist und wie es dazu kam. React ist eine JavaScript-Bibliothek. Es ist Open Source, also die Quelle. Der Code ist für jedermann zugänglich und einsehbar. Und es wurde von Facebook mit erstellt. Die Absicht, auch das Web zu vereinheitlichen. Als mobiles User Interface Design unter einem gemeinsamen Dach. Den ersten gibt es eigentlich schon eine ganze Weile Version von. React wird der Öffentlichkeit vorgestellt als. Schon im Jahr 2013. Seit etwa 2018 ist es jedoch sprunghaft gewachsen Dies führt zu anderen erweiterten Frameworks wie NextJS tatsächlich React als Basis verwenden und darauf aufbauen. Von seinen bereits beeindruckenden und umfassenden Fähigkeiten. React wird hauptsächlich für dynamische Anwendungen verwendet. Das bedeutet, dass sich ihr Inhalt mit den Daten ändert. Hinter den Schnittstellenänderungen. Jetzt mit einer Standard-Old-School-Website. War nicht der Fall. Also jedes Mal, wenn ein Benutzer gehen würde. Zu einer neuen URL, die mit einem verknüpft ist. Bei der Anwendung müsste eine neue HTTP-Anfrage gestellt werden und so weiter des Inhalts, aus dem die Seite besteht. Also jede einzelne Grafik, alles für den Overhead Menü, die Seitenleiste, die Fußzeile. Müssen von Grund auf neu erstellt und neu gerendert werden Mal wieder. Wenn Sie sich vorstellen können, ist dies nicht der Fall. Sehr effizient und React löst dieses Problem. Durch die Verwendung von partiellem Rendering und Datenhydrierung. Das bedeutet, sobald unsere Vorlage geladen ist Browser, nur die. Daten, die vom aktuell angezeigten Status abweichen, werden aktualisiert. Im Gegensatz zu einer Website der alten Schule, auf die man sich verlassen konnte. Das Client-Server-Modell der alten Schule. Was das bedeutet, dass die einzigen Teile. Diese Änderungen am Bildschirm des Benutzers sind die Unterschiede vom aktuell angezeigten Zustand. Daher führt das Navigieren von Seite zu Seite nicht mehr zu einem vollständigen Seitenwechsel Neudarstellung aller einzelnen Dinge, die ein Benutzer sieht. Dies führt zu einem wesentlich effizienteren Datendurchsatz Strategie, da weniger Daten vom Server übertragen werden müssen an den Client. Darüber hinaus nutzt React eine weitere Funktion, um eine zu erreichen Leistungssteigerung ist der Einsatz von Shadow Dom. Mittlerweile sind Sie höchstwahrscheinlich vertraut. Mit unserem Standard-Dom, aber eben dazu. Stellen Sie sicher, dass wir alle eingeschaltet sind. Auf derselben Seite ist „dom“ ein Akronym. Was für Document Object Module steht. Bei der Nutzung unserer Internetseite handelt es sich ansonsten um ein Dokument in den Browser geladen, sein Inhalt wird analysiert und alles die Informationen über das Objekt, seine. Die Struktur sowie alle ihre Bestandteile werden geladen in die Erinnerung. Vom Client oder vom Browser. Aber leider für uns, mit allem, was dazugehört Neben unserer Bewerbung landen auch andere Dinge dort Und. Sie beziehen sich auf die Kernfunktionalität des Browsers. Das ist für uns nicht sehr hilfreich. Und hier kommt Shadow Dom ins Spiel. Shadow Dom ist eine Untergruppe des regulären Doms, und sein Hauptvorteil ist. Dass die einzigen Informationen, die es speichert, die Informationen sind, die betrifft unsere Bewerbung und absolut nichts anderes. Wir haben weniger Zeug in unserem Schattendom. Dann ist Dom natürlich von Vorteil. Und die Tatsache, dass alles auf unsere Bewerbung angewendet wird, bedeutet nur das wir können. Store, extract and manipulate only the parts that we need. This leads to a significant performance boost. React is component based, meaning that to. Achieve the results that we are after, we will break up our application into a series of components to encapsulate each visual part of the user interface. That gives us the ability to reuse. Our component throughout the site, speeding up our development efforts. And additionally, it leads to uniformity in. The application, thus enabling a smoother, less confusing and more comprehensive user experience, since. Components used for similar things will be used in a similar manner throughout the application. Lastly, for those who may be familiar with other JavaScript frameworks, react provides a one way data binding. What that means is the data within. Our application flows in one direction, in one direction only, from the top parent. To the bottom child component. In our next lesson, we will take a look at why we would use React over plain JavaScript in HTML. Thank you for watching. Bye.

Anbieter : Tony Davydets 1 Lektion · 11m auf Arabisch, Deutsch, Englisch, Spanisch, Französisch, Portugiesisch, Chinese

Kursbeschreibung

In diesem Kurs lernen Sie, was React ist und warum es ein leistungsfähiges Werkzeug für die Erstellung von Benutzeroberflächen ist. Sie lernen die Vorteile von React gegenüber einfachem JavaScript kennen und erfahren, wie Sie mit dem Dienstprogramm create-react-app eine React-Entwicklungsumgebung einrichten.

Einer der Hauptvorteile von React ist seine Fähigkeit, komplexe Zustände und Benutzerinteraktionen einfach zu verwalten. Mit React können Sie wiederverwendbare Komponenten erstellen, die sich leicht aktualisieren und ändern lassen, was es ideal für die Erstellung großer und komplexer Webanwendungen macht. Sie werden die Hauptunterschiede zwischen React und einfachem JavaScript kennenlernen, einschließlich der Vorteile eines komponentenbasierten Ansatzes für die Erstellung von Benutzeroberflächen. Außerdem lernen Sie das virtuelle DOM von React kennen und erfahren, wie es die Leistung optimiert, indem es die Anzahl der zum Rendern von Änderungen erforderlichen Aktualisierungen minimiert.

Für den Einstieg in React erfahren Sie, wie Sie mit dem Dienstprogramm create-react-app schnell und einfach ein neues React-Projekt einrichten können. Sie lernen, wie Sie das Dienstprogramm installieren und konfigurieren und wie Sie damit eine grundlegende React-Anwendung erstellen.

Am Ende dieses Abschnitts werden Sie ein solides Verständnis davon haben, was React ist, warum es ein so beliebtes Werkzeug für die Webentwicklung ist und wie Sie Ihre eigenen React-Anwendungen mit dem Dienstprogramm create-react-app erstellen können. Dieses Wissen bildet eine solide Grundlage für den Rest des Kurses, in dem Sie fortgeschrittenere React-Themen erforschen und immer komplexere Anwendungen erstellen werden.

Was Sie lernen werden

Verstehen Sie, was React ist und warum es ein leistungsstarkes Tool zum Erstellen von Benutzeroberflächen ist
Vergleichen Sie React mit einfachem JavaScript und die Vorteile eines komponentenbasierten Ansatzes
Erklären Sie, wie das React Virtual DOM die Leistung optimiert, indem es Render-Updates minimiert
Richten Sie eine React-Entwicklungsumgebung mithilfe des Dienstprogramms create-react-app ein
Erstellen Sie eine grundlegende React-Anwendung mit create-react-app
Ermitteln Sie, wann React zu verwenden ist und warum React entstanden ist

Wichtige Erkenntnisse

React ist ein Tool zum Erstellen von Benutzeroberflächen und bietet Vorteile gegenüber einfachem JavaScript.
React lässt Sie wiederverwendbare Komponenten erstellen, die leicht aktualisiert und modifiziert werden können, was es für große und komplexe Webanwendungen geeignet macht.
Das React Virtual DOM optimiert die Leistung, indem es die Anzahl der Aktualisierungen minimiert, die zum Rendern von Änderungen erforderlich sind.
Das Dienstprogramm create-react-app lässt Sie schnell und einfach ein neues React-Projekt einrichten und konfigurieren.
Diese Einführung bildet eine Grundlage für die Erforschung fortgeschrittenerer React-Themen und den Aufbau zunehmend komplexerer Anwendungen.

Häufig gestellte Fragen

Was werde ich in diesem Kurs lernen?

Sie werden erfahren, was React ist und warum es leistungsstark für das Erstellen von Benutzeroberflächen ist, die Vorteile von React gegenüber einfachem JavaScript, den komponentenbasierten Ansatz, das React Virtual DOM und wie Sie eine React-Umgebung mithilfe des Dienstprogramms create-react-app einrichten.

Benötige ich vorherige JavaScript-Erfahrung?

Der Kurs untersucht die Hauptunterschiede zwischen React und einfachem JavaScript und die Vorteile der Verwendung von React gegenüber einfachem JavaScript, daher wird er in Bezug auf JavaScript-basierte Webentwicklung präsentiert.

Welche Themen werden in den Lektionen behandelt?

Die Lektionen behandeln Was ist React?, Warum React und nicht JavaScript?, und Erstellen einer React-App mit dem Dienstprogramm create-react-app.

Was kann ich bis zum Ende tun?

Am Ende haben Sie ein solides Verständnis dafür, was React ist, warum es ein beliebtes Tool für die Webentwicklung ist, und wie Sie Ihre eigenen React-Anwendungen mit dem Dienstprogramm create-react-app erstellen.

Ist dieser Kurs für Anfänger in React?

Ja. Es ist eine Einführung, die behandelt, warum React entstanden ist, wann React zu verwenden ist und das Dienstprogramm create-react-app, und bildet eine Grundlage für fortgeschrittenere React-Themen.