Erstellen von Benutzeroberflächen aus Komponenten.
React lässt dich Benutzeroberflächen aus einzelnen Komponenten erstellen. Erstelle deine eigenen React-Komponenten wie zum Beispiel Thumbnail, LikeButton und Video. Dann kombinieren Sie sie zu ganzen Screens, Seiten, und Anwendungen.
Ob du alleine arbeitest oder mit tausenden anderen Entwicklern, das Arbeiten mit React fühlt sich gleich an. Es ist so konzipiert, dass du Komponenten, die von unabhängigen Personen, Teams und Organisationen geschrieben wurden, nahtlos kombinieren kannst.
Schreibe Komponenten mit Code und Markup
React-Komponenten sind JavaScript-Funktionen. Möchtest du Inhalte bedingt anzeigen? Verwende eine if-Anweisung. Möchtest du eine Liste anzeigen? Probiere es mit map(). React lernen ist Programmieren lernen.
Diese Syntax wird JSX genannt. Sie ist eine JavaScript-Syntax-Erweiterung, die durch React populär wurde. Durch die Nähe von JSX-Markup zur zugehörigen Rendering-Logik lassen sich React-Komponenten einfach erstellen, pflegen und löschen.
Füge Interaktivität hinzu, wo immer du sie brauchst
React-Komponenten empfangen Daten und geben zurück, was auf dem Bildschirm erscheinen soll. Du kannst ihnen neue Daten als Reaktion auf eine Interaktion übergeben, zum Beispiel, wenn der Benutzer etwas eingibt. React wird den Bildschirm aktualisieren, um die neuen Daten anzupassen.
Du musst nicht deine ganze Seite in React erstellen. Füge React zu deiner vorhandenen HTML-Seite hinzu und rendere interaktive React-Komponenten überall darauf.
Mache Full-Stack
Mit einem Framework
React ist eine Bibliothek. Sie ermöglicht es, Komponenten zusammenzufügen, schreibt aber nicht vor, wie Routing und das Abrufen von Daten implementiert werden sollen. Um eine gesamte App mit React zu erstellen, empfehlen wir ein Full-Stack React-Framework wie zum Beispiel Next.js oder oder Remix.
confs/[slug].js
import { db } from './database.js';
import { Suspense } from 'react';
async function ConferencePage({ slug }) {
const conf = await db.Confs.find({ slug });
return (
<ConferenceLayout conf={conf}>
<Suspense fallback={<TalksLoading />}>
<Talks confId={conf.id} />
</Suspense>
</ConferenceLayout>
);
}
async function Talks({ confId }) {
const talks = await db.Talks.findAll({ confId });
const videos = talks.map(talk => talk.video);
return <SearchableVideoList videos={videos} />;
}
19 Videos
React ist auch eine Architektur. Frameworks, die es implementieren, ermöglichen es, Daten in asynchronen Komponenten abzurufen, die auf dem Server oder sogar während des Builds ausgeführt werden. Lese Daten aus einer Datei oder einer Datenbank und gib sie an deine interaktiven Komponenten weiter.
Benutze das Beste von jeder Plattform
Benutzer lieben Web- und Native-Apps aus unterschiedlichen Gründen. React ermöglicht es, sowohl Web-Apps als auch Native-Apps mit den gleichen Fähigkeiten zu erstellen. Es stützt sich auf die einzigartigen Stärken jeder Plattform, um ein natives Gefühl auf jeder Plattform zu erzeugen.
Bleibe dem Web treu
Menschen erwarten, dass die Seiten von Webanwendungen schnell geladen werden. Auf dem Server kannst du mit React mit dem Streaming von HTML beginnen, während du noch Daten abrufen, und den verbleibenden Inhalt nach und nach auffüllen, bevor JavaScript-Code geladen wird. Auf dem Client kann React Standard-Web-APIs verwenden, um Ihre Benutzeroberfläche auch während des Renderings reaktionsfähig zu halten.
Wirklich nativ werden
Benutzer erwarten, dass native Apps wie ihre Plattform aussehen und sich anfühlen. React Native und Expo ermöglichen es, Apps in React für Android, iOS und mehr zu erstellen. Sie sehen und fühlen sich nativ an, weil ihre Benutzeroberflächen wirklich nativ sind. Es ist keine Web-View - Deine React-Komponenten rendern echte Android- und iOS-Ansichten, die von der Plattform bereitgestellt werden.
Mit React kannst du ein Web- und ein Native-Entwickler sein. Dein Team kann auf viele Plattformen ausliefern, ohne die Benutzererfahrung zu beeinträchtigen.
Upgrade, wenn die Zukunft bereit ist
React geht sorgfältig mit Änderungen um. Jeder React-Commit wird auf geschäftskritischen Oberflächen mit über einer Milliarde Benutzern getestet. Über 100.000 React-Komponenten bei Meta sorgen dafür, dass jede Migrationsstrategie validiert wird.
Das React Team forscht immer daran, wie React verbessert werden kann. Einige Forschungen dauern Jahre, um sich auszuzahlen. React hat eine hohe Messlatte, um eine Forschungsidee in die Produktion zu übernehmen. Nur bewährte Ansätze werden Teil von React.
Trete einer Community
von Millionen bei
Du bist nicht alleine. Zwei Millionen Entwickler aus der ganzen Welt besuchen jeden Monat die React-Dokumentation. React ist etwas, auf das sich Menschen und Teams einigen und verlassen können.
Das ist der Grund, warum React mehr als eine Bibliothek, eine Architektur oder sogar ein Ökosystem ist. React ist eine Community. Es ist ein Ort, an dem du um Hilfe bitten, Möglichkeiten finden und neue Freunde treffen kannst. Du wirst sowohl Entwickler als auch Designer, Anfänger und Experten, Forscher und Künstler, Lehrer und Schüler treffen. Unsere Hintergründe können sehr unterschiedlich sein, aber React ermöglicht es uns allen, gemeinsam Benutzeroberflächen zu erstellen.
