Wir werden eine einfache Webanwendung erstellen, mit der Benutzer Produkte verwalten können, die sie verkaufen möchten.
Wir werden 3 Projekte bauen. Das FrontEnd-Projekt wird eine progressive Webanwendung sein, die mit Vuejs, Vue Router und Vuetify erstellt wird, während wir serverseitig zwei .NET Core 3.0-Webanwendungen mit Visual Studio 2019 erstellen werden: eine stellt eine REST-API bereit, während die zweite dafür sorgt der Authentifizierung mit Identity Server 4.
Dieses Projekt interagiert mit dem Benutzer über einen Browser, indem es dynamisch eine HTML-Benutzeroberfläche erstellt, und kommuniziert mit dem Server über Javascript und JSON.
Dieses Projekt ist dafür verantwortlich, die Daten auf dem Server zu speichern und auf die Client-Anfragen über http und json zu antworten.
Dieses Projekt kümmert sich um den Authentifizierungsteil. Es werden JWT-Token ausgegeben, die von der Clientanwendung verwendet werden, um Zugriff auf den Server zu erhalten.
Stellen Sie sicher, dass Sie den Workload „.NET Core Cross-Platform Development“ installiert haben. Sie können Workloads überprüfen und installieren, indem Sie den Visual Studio Installer starten.
Weitere Informationen finden Sie unter https://www.microsoft.com/net/download/windows
Wir werden unsere Projekte in einfache Schritte aufteilen. Jeder Schritt konzentriert sich auf eine Aufgabe und baut auf dem vorherigen Schritt auf. Wir beginnen mit einfachen Projekten, die im Laufe der Zeit immer komplexer werden. Beispielsweise werden wir uns zunächst nicht auf Authentifizierung und Autorisierung konzentrieren. Wir werden es zu einem späteren Zeitpunkt hinzufügen.
Dieser Ordner enthält verschiedene Unterordner. Jeder Unterordner repräsentiert eine Phase in unserem Projekt. „Start“-Ordner sind die Ausgangspunkte jedes Schritts. „Lösungs“-Ordner sind die endgültigen Versionen jedes Schritts und werden Ihnen für den Fall ausgehändigt, dass Sie am Ende jedes Labors überprüfen möchten, wie Ihr Projekt aussehen soll. Sie müssen lediglich einen Startordner öffnen, der dem Labor entspricht, das Sie ausprobieren möchten (z. B. Lab01/Start
, um zu beginnen) und den Anweisungen in der Datei readme.md
folgen. Wenn Sie fertig sind, können Sie Ihre Arbeit gerne mit der Lösung im Lösungsordner vergleichen.
Lab08SolutionMarketPlaceIdentityServerIdentityServer.sln
in Visual StudioLab08SolutionMarketPlaceIdentityServer
dotnet run /seed
http://localhost:5002
und stellen Sie sicher, dass das Projekt betriebsbereit ist Lab08SolutionMarketPlaceMarketplaceMarketPlace.sln
in Visual StudioLab08SolutionMarketPlacespaclient
in Visual Studio Codenpm install
npm run serve