Tutoriel et exemples de codes pour ASP.NET 5 SPA avec React
Aperçu
Ceci suit ce qui suit pour créer les codes de modèle par défaut.
- https://docs.microsoft.com/en-us/aspnet/core/client-side/spa/react?view=aspnetcore-5.0&tabs=netcore-cli
Vous pouvez consulter ce qui suit pour des explications plus détaillées.
- https://dev.to/packt/creating-spas-using-asp-net-core-and-react-59a0
La structure des dossiers est la suivante
- Dossier my-new-app ClientApp : il s'agit de l'application React. La sortie de build dans le dossier build sera servie.
- Dossier my-new-app Controllers : il contient une API Web factice à laquelle l'application React peut envoyer des requêtes.
- Pour transmettre des données du backend au frontend, il faut utiliser l'API Web. Si les données sont nécessaires avant l'authentification, on peut alors créer un chemin API sans avoir besoin d'authentification pour transmettre les données qui n'ont pas besoin d'être protégées.
- Dossier my-new-app Pages : il contient des pages ASP.NET Razor standard.
- my-new-app Program.cs : il s'agit du fichier ASP.NET standard.
- my-new-app Startup.cs : ceci spécifie que cela sert les fichiers statiques SPA du dossier CilentApp build. Cela configure également l'API Web.
- my-new-app WeatherForcast.cs : il s'agit du modèle utilisé par l'API Web factice.
Une fois l'application exécutée, ouvrez https://localhost:5001 pour voir le site Web.
Actions GitHub incluses
- Construction et test DOTNET
- CodeQL
Extensions utiles de Visual Studio Code
- https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp
- https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory
Références utiles de Visual Studio Code
- https://docs.microsoft.com/en-us/dotnet/core/tutorials/with-visual-studio-code#debug
- https://docs.microsoft.com/en-us/dotnet/core/tools/
- https://stackoverflow.com/questions/34275209/xml-auto-commenting-c-sharp-in-visual-studio-code
- https://stackoverflow.com/questions/47995468/vscode-c-sharp-go-to-definition-f12-not-working
- https://www.strathweb.com/2019/04/roslyn-analyzers-in-code-fixes-in-omnisharp-and-vs-code/
Commandes CLI .NET utiles
- (Créez le modèle par défaut pour le backend et le frontend) dotnet new réagir -o my-new-app
- (Powershell) SET ASPNETCORE_ENVIRONMENT=Développement
- (dans le dossier ma-nouvelle-application) build dotnet
- (dans le dossier ma-nouvelle-application) dotnet run