How to connect the front on React and the backend on ASP.NET, provided that both front and back are presented as 2 separate projects?

Question

JavaScript

I can’t throw off both projects because there is too much code, even if we consider each separately.
So, what would you recommend reading besides Cors in order to at least understand what you are doing?

ps both projects will hang on different localhosts.

Answer 1

You don't need anything special to connect.
The front is most likely launched through the webpack-dev-server - you can throw the address of the backend into it through environment variables.
On the prod, the front will most likely be distributed from nginx, so no parameter can be thrown, but you can access the same domain on which the front sits (make requests like fetch("/api/something")) - and already on side of nginx to resolve.

Answer 2

First, according to the organization
Application - repository folder and all other projects, also contains Jenkins scripts and documentation readme.md
Application\Application.Web - net core application project
Application\Application.Web\app ​​- frontend
Application\Application.BL - business logic
Basically you can run the front directly from the backend project, but it's really long and no errors are visible, in general it's easier to run from a separate console.
The back is edited in 2019 studio, the front is in Visual studio code.
Authorization through identityserver4 all in one application.
CORS and realms are configured via env files + jenkins replaces connection strings on build.

Answer 3

The front is most likely a create react app or a self-written webpack config.
You can write a config for webpack to proxy requests to api to a specific subfolder of the domain
https://webpack.js.org/configuration/dev-server/#d...
Beck raise it separately config
On production, you will need to configure nginx so that it proxies one subfolder to the API raised nearby and sends the rest of the requests to the front index file