Fetching the shopping cart on page load

We just saw how to use amp-list to pull in a list of related products on a web page. Now let's try something a bit different. In the last chapter, we implemented a basic shopping cart: when an item was added to the cart, we displayed a summary of the cart contents after receiving a response from the server backend. A problem with this approach was that we couldn't show the cart summary on page load; we had to wait for the user to add an item and submit a form first. So if the user navigated to another page, for example, the cart summary would no longer be visible. We can fix this with amp-list.

We'll set it up so that on page load, amp-list will fetch the shopping cart, using the CLIENT_ID variable substitution we saw in the last chapter to identify the user.

First, we'll set up a server endpoint to return the same JSON data that represents the cart as before. Well, almost the same; we've added a new property, cart_total_items, that we'll display in...