v19.2Latest

Erstellen einer React-App

Wenn Sie eine neue App oder Website mit React erstellen möchten, empfehlen wir, mit einem Framework zu beginnen.

Wenn Ihre App Anforderungen hat, die von bestehenden Frameworks nicht gut abgedeckt werden, Sie lieber Ihr eigenes Framework bauen möchten oder Sie einfach die Grundlagen einer React-App lernen möchten, können Sieeine React-App von Grund auf erstellen.

Full-Stack-Frameworks

Diese empfohlenen Frameworks unterstützen alle Funktionen, die Sie benötigen, um Ihre App in der Produktion bereitzustellen und zu skalieren. Sie integrieren die neuesten React-Funktionen und nutzen die React-Architektur.

Hinweis

Full-Stack-Frameworks benötigen keinen Server.

Alle Frameworks auf dieser Seite unterstützen Client-seitiges Rendering (CSR), Single-Page-Apps (SPA) und statische Seitengenerierung (SSG). Diese Apps können ohne Server auf einemCDNoder einem statischen Hosting-Dienst bereitgestellt werden. Darüber hinaus ermöglichen diese Frameworks es Ihnen, bei Bedarf serverseitiges Rendering auf Routenebene hinzuzufügen.

So können Sie mit einer rein clientseitigen App beginnen und später, wenn sich Ihre Anforderungen ändern, Serverfunktionen für einzelne Routen aktivieren, ohne Ihre App neu schreiben zu müssen. Informationen zur Konfiguration der Rendering-Strategie finden Sie in der Dokumentation Ihres Frameworks.

js (App Router)

Der App Router von Next.jsist ein React-Framework, das die React-Architektur voll ausnutzt, um Full-Stack-React-Apps zu ermöglichen.

npx create-next-app@latest

js wird vonVercelgepflegt. Sie könneneine Next.js-Appauf jedem Hosting-Anbieter bereitstellen, der Node.js oder Docker-Container unterstützt, oder auf Ihrem eigenen Server. Next.js unterstützt auchstatischen Export, der keinen Server benötigt.

React Router (v7)

React Routerist die beliebteste Routing-Bibliothek für React und kann mit Vite kombiniert werden, um ein Full-Stack-React-Framework zu erstellen. Es betont standardisierte Web-APIs und bietet mehrereeinsatzbereite Vorlagenfür verschiedene JavaScript-Laufzeitumgebungen und Plattformen.

Um ein neues React Router Framework-Projekt zu erstellen, führen Sie aus:

npx create-react-router@latest

React Router wird vonShopifygepflegt.

Expo (für native Apps)

Expoist ein React-Framework, mit dem Sie universelle Android-, iOS- und Web-Apps mit wirklich nativen Benutzeroberflächen erstellen können.Es bietet ein SDK fürReact Native, das die Verwendung der nativen Teile erleichtert. Um ein neues Expo-Projekt zu erstellen, führen Sie aus:

npx create-expo-app@latest

Wenn Sie neu bei Expo sind, sehen Sie sich dasExpo-Tutorialan.

Expo wird vonExpo (dem Unternehmen)gepflegt. Das Erstellen von Apps mit Expo ist kostenlos, und Sie können sie ohne Einschränkungen in den Google und Apple App Stores einreichen. Expo bietet zusätzlich optionale kostenpflichtige Cloud-Dienste an.

Es gibt andere aufstrebende Frameworks, die auf unsere Vision von Full-Stack-React hinarbeiten:

  • TanStack Start (Beta): TanStack Start ist ein Full-Stack-React-Framework, das von TanStack Router angetrieben wird. Es bietet vollständiges SSR-Dokument, Streaming, Serverfunktionen, Bundling und mehr mit Tools wie Nitro und Vite.
  • RedwoodSDK: Redwood ist ein Full-Stack-React-Framework mit vielen vorinstallierten Paketen und Konfigurationen, die das Erstellen von Full-Stack-Webanwendungen erleichtern.
Deep Dive
Welche Funktionen bilden die Vision der React-Teams für eine Full-Stack-Architektur?

Von Grund auf beginnen

Wenn Ihre App Anforderungen hat, die von bestehenden Frameworks nicht gut bedient werden, Sie lieber Ihr eigenes Framework bauen möchten oder Sie einfach die Grundlagen einer React-App lernen möchten, gibt es andere Optionen, um ein React-Projekt von Grund auf zu starten.

Von Grund auf zu beginnen gibt Ihnen mehr Flexibilität, erfordert aber, dass Sie Entscheidungen darüber treffen, welche Tools Sie für Routing, Data Fetching und andere gängige Nutzungsmuster verwenden möchten. Es ist ähnlich wie der Aufbau Ihres eigenen Frameworks, anstatt ein bereits existierendes Framework zu nutzen. Dievon uns empfohlenen Frameworkshaben eingebaute Lösungen für diese Probleme.

Wenn Sie Ihre eigenen Lösungen bauen möchten, lesen Sie unsere Anleitung zumAufbau einer React-App von Grund auffür Anweisungen, wie Sie ein neues React-Projekt mit einem Build-Tool wieVite,ParceloderRSbuildeinrichten.

Wenn Sie ein Framework-Autor sind und daran interessiert sind, auf dieser Seite aufgeführt zu werden,teilen Sie uns dies bitte mit.

上一篇Installation下一篇Eine React-App von Grund auf erstellen