
The figure shows a browser window at the top left, where a request is made to a server placed at the right side of the browser window as follows "I want to forward slash vacation".
Step 1: A request is made.
Step 2: Server performs minimal processing and returns H T M L.
Step 3: Requested H T M L with JavaScript file references is generated.
Step 4: Requests for JavaScript files are made from the browser to the server.
Step 5: The requested JavaScript files are sent to the browser from the server.
Step 6: JavaScript executes and then makes asynchronous data fetches from web “A” P I s with another server placed at the bottom right of the figure.
Note: Web “A” P I s could be on same server or different servers.
Step 7: Web “A” P I accesses server-based resources such as databases to fetch the requested information.
Step 8: Web “A” P I s return data in J SON format to the browser.
Step 9: JavaScript continually updates page based on received data and user actions and displays it on the browser window visible to the user, which is placed at the bottom left of the figure.
The browser windows on the left side of the figure are a part of Front end and the servers at the right side of the figure are a part of the Back End.
Back