Enough theory! Let's start building our client-side checkout components to complete the checkout process of our phone shop. We'll start by making the modifications we need for the containing checkout page, which we'll use to control the display of the new child components we're about to create. Open up the ClientApp/pages/Checkout.vue file, then modify the template section as follows:
<template>
<b-container class="page pt-4">
<h1>Checkout</h1>
<checkout-success v-if="success" :order="order" />
<b-row v-else>
<b-col cols="4" order="2">
<cart-summary />
</b-col>
<b-col cols="8">
<checkout-form @success="onSuccess" />
</b-col>
</b-row>...