Our great sponsors
-
BrunoLau.SpaServices
Port of Microsoft.AspNetCore.SpaServices into .NET 6 by using the Jering.Javascript.NodeJS interop library
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
WorkOS
The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
It seems like you're trying to solve a developer experience, or DX, problem. I believe the "norm" is to have these scripts run separately, e.g., run npm start and dotnet watch in separate terminals. However, if you want to make it so you don't have to do that, which is fine everyone develops differently, then you could look into concurrently. Then you could add a script to the frontend's package.json like npm start to run concurrently "webpack serve" "dotnet watch".
If you aren't using React or Angular you probably want to take a look at this project, which includes more generic webpack support that Microsoft dropped after Asp.Net Core 2: https://github.com/brunolau/BrunoLau.SpaServices
I use a separate project for the frontend using Vite. It's lightning fast compared to webpack.
Later, I came across Parcel https://parceljs.org/, it really abstracts out a lot of nitty-gritty details and I prefer to use Parcel in my new projects. I don't have enough knowledge to say what to choose when, but, this podcast might help https://frontendhappyhour.com/episodes/a-parcel-of-drinks-parcel/
You can refer to this grpc spa example. It also demonstrates how to use grpc instead of restful API to communicate with dotnet backends.
Related posts
- Webpack returning empty object when doing an import
- Setup React Typescript with Vite & ESLint
- Use CSS Variables to style react components on demand
- Ask HN: How do we include JavaScript scripts in a browser these days?
- Deploy a react projects that are inside a subdirectories to GitHub Pages using GitHub Actions (CI/CD)