Tutorial dan contoh kode untuk ASP.NET 5 SPA dengan React
Ringkasan
Ini mengikuti yang berikut ini untuk membuat kode templat default.
- https://docs.microsoft.com/en-us/aspnet/core/client-side/spa/react?view=aspnetcore-5.0&tabs=netcore-cli
Anda bisa simak berikut ini untuk penjelasan lebih detailnya.
- https://dev.to/packt/creating-spas-using-asp-net-core-and-react-59a0
Struktur foldernya adalah sebagai berikut
- folder my-new-app ClientApp: Ini adalah aplikasi React. Output build di folder build akan disajikan.
- folder my-new-app Controllers: Ini memiliki API Web tiruan yang dapat dikirimi permintaan oleh aplikasi React.
- Untuk meneruskan data apa pun dari backend ke frontend, seseorang harus menggunakan Web API. Jika data diperlukan sebelum autentikasi, maka seseorang dapat membuat jalur API tanpa memerlukan autentikasi untuk meneruskan data yang tidak perlu dilindungi.
- folder my-new-app Pages: Ini memiliki beberapa halaman ASP.NET Razor standar.
- my-new-app Program.cs: Ini adalah file ASP.NET standar.
- my-new-app Startup.cs: Ini menetapkan bahwa ini menyajikan file statis SPA dari folder CilentApp build. Ini juga menyiapkan Web API.
- my-new-app WeatherForcast.cs: Ini memiliki model yang digunakan oleh API Web tiruan.
Setelah aplikasi berjalan, buka https://localhost:5001 untuk melihat situs web.
Termasuk Tindakan GitHub
- Pembuatan dan pengujian DOTNET
- KodeQL
Ekstensi Visual Studio Code yang berguna
- https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp
- https://marketplace.visualstudio.com/items?itemName=donjayamanne.gihistory
Referensi Kode Visual Studio yang berguna
- 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/
Perintah .NET CLI yang berguna
- (Buat template default untuk backend dan frontend) dotnet new react -o my-new-app
- (Powershell) SET ASPNETCORE_ENVIRONMENT=Pengembangan
- (di folder aplikasi baru saya) dotnet build
- (di folder aplikasi baru saya) dotnet run
