How does frontend (client-side) webservice integration work?

In frontend integration the user's browser calls the external API directly with JavaScript after the page has loaded — your own webserver is not involved in those calls.

The flow has two distinct phases. First the page is delivered normally; then the JavaScript on it talks to the external service on its own:

1. The browser requests the HTML page from your webserver and renders it.
2. Later, a user action or a timer triggers JavaScript on the page.
3. That JavaScript calls the external API directly using fetch().
4. The API returns data (usually JSON).
5. JavaScript updates the DOM, so the new data appears without a page reload.

The defining trait: after the initial page load, every API call goes browser → external service and back. Your server never sees them.

That's what makes it simple — no backend code to write — but it has a hard consequence: the request is made from the user's machine, so any API key in the JavaScript is visible to that user, and the external service must allow cross-origin (CORS) requests from the browser.

Go deeper:

• Using the Fetch API — MDN — the canonical guide to making the browser HTTP request and handling the response.