How can I connect my front end to my individually created backend-CodePudding

I am a beginner in creating a code and I am trying to code using vue js for my front end and aspnet core for my backend (web api). There arent many references in creating a to do list with this two connected.

I have already individually set up my front end in vs code while my back end in c#. I am having a hard time in connecting this two as there is not much update reference. How can I call my backend and connect it to my vue js.

thank you!

CodePudding user response：

The first thing you need to do is open the back end CORS settings. It connects to an endpoint on the Vue side, you can use axios framework to pull data Here is an example https://www.freecodecamp.org/news/how-to-build-an-spa-with-vuejs-and-c-using-net-core/

CodePudding user response：

All you need to do is call the backend via API. Get the data via GET method, send the data via POST method. Let's say you want to get person list from the backend. You can do this -

 const response = await fetch('https://yourawesomebackend.com/api/person/getpeople');
                    const content = await response.json();
// Now manipulate the DOM with the response.

In your backend, you might want to do this -

[Route("api/[controller]/[action]")]
[ApiController]
public class PersonController : ControllerBase
{
    public IActionResult GetPeople()
    {
        // read people from database
        var people = getFromDatabase();
        return Ok(people);
    }
}

Hope this helps.