Startseite>ASP-Quellcode>Andere Kategorien
Herunterladen



Beschreibung

React Core Boilerplate ist ein Ausgangspunkt für das Erstellen von universellen/isomorphen React-Webanwendungen mit ASP.NET Core 3 und serverseitigem Rendering. Alle funktionieren gut aus der Schachtel. Es ist auch hilfreich für Neulinge. Das Projekt enthält ein gefälschtes Autorisierungssystem. Sie können es also in Identität oder den anderen ändern.
TypeScript- und JavaScript -Versionen sind verfügbar. ⚡️

Visual Studio Marketplace

Screenshots

Änderungen

v. 2.0.3 (2020-07-03)
  • Docker -Unterstützung hinzugefügt. ?
  • Dank Xuhaojun wurde XSS -Angriffsprävention hinzugefügt.
  • Aktualisierte Abhängigkeiten, nicht verwendete Namespaces entfernt.
v. 2.0.0 (2020-05-08)
  • Migriert zu .net Core 3.1 . ?
  • Mit React-Bootstrap auf Bootstrap 4 migriert.
  • Migriert nach Formik.
  • Redux speichert auf Redux Toolkit, um die Entwicklung mit Redux zu steigern. Reduzierter Code.
  • Protokollierung und Serilog .
  • HTTPS-Unterstützung für server-side rendering hinzugefügt.
  • Der bearbeitbare Statuscode in Routen für SEO hinzugefügt.
  • Einige Abhängigkeiten aktualisiert.
  • Stabilitätsbehebungen.
  • Unnötige NPM -Abhängigkeiten entfernt.
v. 1.7.1 (2019-06-02)
  • Aktualisierte React , Redux , React-Router und andere mit ihnen verbundene NPM-Pakete.
  • Aktualisierte kritische NPM -Abhängigkeiten.
  • Unnötige NPM -Abhängigkeiten entfernt.
v. 1.7.0 (2019-05-05)
  • Repository -Umstrukturierung.
  • Die JavaScript -Version des React -Kernkesselplatte hinzugefügt. ?
  • Stabilitätsbehebungen.
  • Kritische Abhängigkeiten aktualisiert.
v. 1.6.3 (2019-03-19)
  • image-webpack-loader aufgrund von Instabilität entfernt.
v. 1.6.2 (2019-03-15)
  • Instabiles Terser -Plugin installiert.
  • Aktualisierte React und andere Pakete dafür (inkl. Typ).
  • Aktualisiertes WebPack .
  • Aktualisierte Webpack -Konfiguration für den Entwicklungsmodus.
v. 1.6.0 (2019-03-13)
  • Aktualisierte .NET Core auf v. 2.2 .
  • Aktualisierte kritische NPM -Pakete.
  • Aktualisierte WebPack -Abhängigkeiten.
  • Verbesserte WebPack -Anbieter- und Bundle -Konfigurationen.
  • Verbesserte .csproj -Datei zum Erstellen und Veröffentlichen von Szenarien.
  • Die Erzeugung der Quellkarte im Entwicklungsmodus festgelegt.
  • Fixes Bundle Compilation im Produktionsmodus.
  • Andere Stabilitätsbehebungen.
v. 1.5.4 (2019-02-04)
  • Einige kleinere Funktionen hinzugefügt.
  • Fehlerbehebungen: collapsing of the Bootstrap navigation bar , fixed controller and frontend's service in person update case .
  • Aktualisierte Abhängigkeiten.
v. 1.5.3 (2018-12-04)
  • Polyfills für die Unterstützung von IE9 hinzugefügt, IE11: @babel/polyfill , custom-event-polyfill .
  • Aktualisierte Abhängigkeiten.
v. 1.5.2 (2018-12-01)
  • FullText Live -Suche in Beispiel hinzugefügt.
  • Webpack-Plugins hinzugefügt: case-sensitive-paths-webpack-plugin , react-dev-utils
  • Plugins mit Beispielen hinzugefügt: awesome-debounce-promise formik zu verhindern, dass häufige Abfragen bei der Live-Suche durchgeführt werden.
  • Einige funktionale und Textfehler behoben.
v. 1.5.0 (1) (2018-11-07)
  • hosting.json hinzugefügt, das Hosting -Einstellungen enthält und im Produktionsbau verwendet wird.
  • bind-decorator und Beispiele damit hinzugefügt.
  • Beschleunigte das Webpack -Bundle -Gebäude.
  • Aktualisiertes Domain-Wait-Paket. Mit diesem Update können Sie verhindern, dass Sie zweimal isomorphe Abrufanforderungen aufrufen (auf server -prerender und danach - auf clientseitig).
  • Aktualisiertes Redux-Thunk-Paket.
  • Neue React -Komponenten hinzugefügt, um Kopfschmerzen beim Erstellen von Webanwendungen zu verhindern: ModalComponent , Input , MultiSelect , Form . Diese Komponenten werden in Beispielen verwendet.
v. 1.4.5 (2018-11-02)
  • Eine neue Funktion ermöglicht es einer Webanwendung, den Browser -Cookie mit NodeServices freizugeben. Jetzt generiert SSR HTML -Code für authentifizierte Benutzer und stellt authentifizierte isomorphe Anforderungen.
  • Die Methode sendFormData an die ServiceBase.ts , mit der Sie Dateien auf den Server hochladen können.
v. 1.3.5 (2018-10-26)
  • Aktualisierte NPM-Pakete: react , redux , react-router .
  • Ersetzt durch Abschaltungsreakt react-router-redux durch den neuen connected-react-router .
  • Loader , die in einigen Fällen Probleme hatten.
v. 1.3.2 (2018-10-25)
  • Unbenutzte NPM -Pakete entfernt.
  • Package-lock.json hinzugefügt.
  • Project Project.
v. 1.3.0 (2018-10-22)
  • Aktualisiertes React -Paket.
  • Die AppComponent -Komponente wurde hinzugefügt, mit der Sie die "Kraft -Update" der "festgefahrenen" Komponenten durchführen können (für Ex. Loader -Komponente in LoginPage ).
  • Serilog -Protokoll, der sich in Dateien ( logs/ Verzeichnis) und auch in Azure Cloud -Anbieter anmeldet.
v. 1.2.1 (2018-10-20)
  • Loader , die in einigen Fällen bei SSR falsch funktioniert.
v. 1.2.0 (2018-10-18)
  • Aktualisierte Abhängigkeit des "ASP.NET Core" -Pakets aufgrund von Anfälligkeit.
  • Die Funktion wurde hinzugefügt, mit der Sie JSON -Objekte an URL -Abfrage zum GET -and -Löschen -Methoden übergeben können.
v. 1.1.0 (2018-10-16)
  • Behörde AppRoute . Lösung von Problemen mit übergebenen Parameten an Komponenten aus dem React -Router. Wenn Sie es manuell reparieren möchten, finden Sie hier das Commit.

Verwendung

Installation

  1. Installieren Sie die neueste .NET Core SDK und Laufzeit per Link.
  2. Installation des neuesten stabilen Node.js.
  3. Beim ersten Lauf müssen Sie das Projekt schließen, wenn es in Visual Studio oder einer anderen IDE ausgeführt wird. Öffnen Sie den Ordner des Projekts in der Konsole und führen Sie den Befehl npm install aus.
  4. Führen Sie den folgenden Befehl für die Entwicklung im Verzeichnis Ihres Projekts aus. Es wird das Haupt- und Verkäuferbündel zusammenstellen. 
npm run build:dev
  1. Wenn Sie Visual Studio 20xx verwenden, wählen Sie anstelle von IIS Express den YourProjectName oder ReactCoreBoilerplate aus: Klicken Sie auf den Abwärtspfeil in der Nähe des IIS Express und wählen Sie Docker oder andere Option.
  2. Projekt bauen und ausführen. Es beginnt in Windows Console.

Ändern Sie die Webpack -Anbieter -Konfiguration

Wenn Sie die WebPack -Anbieter -Konfiguration ändern, müssen Sie das Lieferantenpaket manuell neu kompilieren. Führen Sie den folgenden Befehl im Verzeichnis Ihres Projekts aus, um dies zu tun: 

npm run build:dev

Mit Docker laufen

Visual Studio 20xx

Wählen Sie einfach die Option Docker in der Symbolleiste aus.

Bauen Sie einen Behälter

Führen Sie den folgenden Befehl im Verzeichnis Ihres Projekts aus: 

docker build -t [my image name] .

Wo [my image name] Ihr Docker -Bildname ist.

Führen Sie einen Produktionsbehälter unter Windows mit HTTPS -Unterstützung aus (für den Test)

  1. Vertrauen Sie dem ASP.NET -Kern -HTTPS -Entwicklungszertifikat unter Windows und MacOS: 
dotnet dev-certs https -ep %USERPROFILE% . aspnet h ttps a spnetapp.pfx -p [my password]

Wo [my password] Ihr Passwort ist.
2. Ausführen: 

dotnet dev-certs https --trust
  1. Bauen Sie Ihren Behälter auf.
  2. Ausführen: 
docker run --rm -it -p 7000:7000 -p 7001:7001 -e ASPNETCORE_URLS= " https://+;http://+ " -e ASPNETCORE_Kestrel__Certificates__Default__Password= " [my password] " -e ASPNETCORE_Kestrel__Certificates__Default__Path=/https/aspnetapp.pfx -v %USERPROFILE% . aspnet h ttps:/https/ [my image name]

wobei [my password] - Ihr Zertifikatkennwort (aus dem 1. Schritt), [my image name] - Ihr Docker -Bildname.

Elemente

Bibliotheken von Drittanbietern:

  • TypeScript - Alle Frontend basierend auf TypeScript.
  • Fork-ts-Checker-Webpack-Plugin-WebPack-Plugin, das den TypeScript-Typ-Checker für einen separaten Prozess ausführt.
  • React - Hauptbibliothek, die als isomorph fungierte.
  • React Router - Router für React.
  • React -Bootstrap - Bootstrap 4 für React.
  • React -Helmet - isomorphe SEO -Helfer.
  • Redux - Speicher.
  • Redux Toolkit - Bibliothek zur Steigerung der Entwicklung mit Redux.
  • Formik - Bibliothek zum Aufbau von Formularen für React.
  • Connected React Router - Redux -Bindung für React -Router.
  • SASS - CSS -Präprozessor.
  • Webpack 4 - Bundler.
  • Axios - isomorphischer Fetch -Util.
  • TS-NAMEOF-Ermöglicht Ihnen die Verwendung von Typen-sicheren Namen von Eingängen im Formular.
  • Mit JSON-to-URL-Ermöglichen Sie, JSON-Objekte an URL-Abfrage zum Get-and-Löschen-Methoden zu übergeben.
  • SERILOG - Ermöglicht Sie, sich in Dateien ( logs/ Verzeichnis) und auch in Azure Cloud -Anbieter anzumelden.

Eigene Bibliotheken / feste Gabeln:

  • Domain-Wait-Ersatz für Domänenaufgaben durch Async/Warte-Support und neue Funktionen.
  • NVAL-JQuery-Validation-ähnlicher Vanille-JS-Validator.
  • NVAL -Tippy - Vanille -JS -Validierung mit fantastischen Tooltips.
  • NSerializejson - Flexible Form zu JSON Serializer basierend auf Vanille -JS.

Probleme

Bekannte Probleme

  • Fehler in ./clientapp/styles/loaders/xxx.scss (./node_modules/css-loader/dist/cjs.js! [...]): Fehler: Enoent: Keine solche Datei oder Verzeichnis, Scandir 'xxx node_modules node-sass vendor'
    Führen Sie npm i und npm rebuild node-sass im Verzeichnis Ihres Projekts aus.

  • Der Ersatz von Webpack Hot Modul [HMR] funktioniert nicht mit IIS
    Wird repariert. Verwenden Sie stattdessen Kestrel für die Entwicklung.

  • HTTP -Fehler 500
    Wahrscheinlich haben Sie nicht die neueste Version von node.js.

  • HTTP -Fehler 502.5
    Sie müssen den neuesten "ASP.NET Core SDK" und "Runtime and Hosting-Bundle" mit diesem Link installieren: https://www.microsoft.com/net/download/dotnet-core/2.1

  • HTTP -Fehler 500 beim Hosting in Azure
    Setzen Sie die "Website_Node_Default_version" in den "App -Einstellungen" in Azure auf 6.11.2.

  • Fehler beim Ausführen im Entwicklungsmodus nach der Veröffentlichung
    Führen Sie npm run build:dev -Befehl im Projekt des Projekts aus.

Andere Probleme

  • Wenn Sie ein Problem mit dem Start des Projekts haben, können Sie Fehler in Protokollen ("/Protokolls" -Verzeichnungen angezeigt. Bitte tun Sie dies, bevor das Problem auf GitHub geöffnet wird. Vergessen Sie nicht, die Version des React -Kernkesselplatte ( JavaScript oder TypeScript ) zu erwähnen.

Lizenz

MIT

Expandieren
Zusätzliche Informationen
Ähnliche Anwendungen
Empfohlen für Sie
Ähnliche Nachrichten Alle