How does the frontend interact with the backend?

Question

JavaScript

Hello. I’ve been making layout for a year and now I need to understand how layout interacts with the backend.
The fact that the backend can generate html layout and give it to the client is understandable, depending on different conditions. I have a question on the forehead, let's say there are 6 cards with cities, the user needs to select (click on it), it is highlighted by adding a class to it, ok. And how will the backend understand which card was chosen and that it was chosen at all? I am making the front in vue.js and the backend will be in python (to my knowledge).
Explain, please!

Answer 1

If you're using vue.js and you most likely need to handle a user action without reloading the page, then try the vue-resource plugin . Purely technically, it sends a request of the type you need (POST, GET, etc.) to the server with arbitrary data using XmlHttpRequest.

this.$http.post('/select-city', {cityId: 1}).then((response) => {
          // success callback
      }, (response) => {
          // error callback
      });

The above snippet can serve as an example of how to handle an event on a click on a card, while you can send to the server, for example, the card ID or something else, and there you already need to implement the processing of the POST request for the route /select-city(if we consider this example) and the passed ID like this requires the business logic of your application.

Answer 2

Take any site with interactivity, install Firefox, install Firebug in it, press F12, open the Network tab and see how the frontend is ... with the backend.

Answer 3

https://learn.javascript.ru/ajax-xmlhttprequest
like this

Answer 4

The first link in Google for "how the Internet works":
http://noob.onthe.io/How+the+Internet works
Was it so hard?

Answer 5

Get or Post request.