diff --git a/functions/src/index.ts b/functions/src/index.ts
index 4027c57..30eaf25 100644
--- a/functions/src/index.ts
+++ b/functions/src/index.ts
@@ -33,7 +33,6 @@ export const checkout = functions.https.onRequest((request, response) => {
 
     // Fill in information from DB
     let promises = [];
-    console.log(request.body);
     let cart = request.body.cart.filter(row => row.quantity > 0);
     cart.forEach(async row =>
       promises.push(
@@ -47,19 +46,15 @@ export const checkout = functions.https.onRequest((request, response) => {
     let products = await Promise.all(promises);
     req.transactions[0].item_list.items = products.map((row, i) => {
       const data = row.data();
-      console.log(data);
       return {name: data.name, sku: data.name, price: data.price, currency: 'CAD', quantity: cart[i].quantity};
     });
     req.transactions[0].amount.total = req.transactions[0].item_list.items.reduce((acc, row, i) => {
       return acc + row.price * row.quantity;
     }, 0);
 
-    console.log(req);
-
     // Send request to PayPal
     let create = new Promise((res, rej) => {
       paypal.payment.create(req, (error, payment) => {
-        console.log(error, payment);
         if (error) rej(error);
 
         let link = payment.links.filter(row => row.rel == 'approval_url').map(row => row.href)[0];
@@ -73,7 +68,7 @@ export const checkout = functions.https.onRequest((request, response) => {
     });
 
     try {
-      response.send(await create);
+      response.json({url: await create});
     } catch (err) {
       console.error(err);
       response.status(500);
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 8c5b052..6fd2852 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -26,6 +26,7 @@ import {ProductsComponent} from './store/products/products.component';
 import {CartComponent} from './store/cart/cart.component';
 import {ViewComponents} from './formulaManager/viewComponents/viewComponents.component';
 import {NewComponentComponent} from './formulaManager/newComponent/newComponent.component';
+import {HttpModule} from '@angular/http';
 
 @NgModule({
   declarations: [
@@ -55,6 +56,7 @@ import {NewComponentComponent} from './formulaManager/newComponent/newComponent.
     BrowserAnimationsModule,
     BrowserModule,
     FormsModule,
+    HttpModule,
     NgxElectronModule,
     ReactiveFormsModule,
     RouterModule.forRoot([
diff --git a/src/app/store/cart/cart.component.html b/src/app/store/cart/cart.component.html
index c024b23..1f00a2d 100644
--- a/src/app/store/cart/cart.component.html
+++ b/src/app/store/cart/cart.component.html
@@ -33,7 +33,7 @@
           <td class="pl-3">{{total() | currency}}</td>
         </tr>
       </table>
-      <button mat-raised-button class="float-right mt-3" color="primary">Checkout</button>
+      <button mat-raised-button class="float-right mt-3" color="primary" (click)="checkout()">Checkout</button>
     </div>
   </mat-card>
 </div>
\ No newline at end of file
diff --git a/src/app/store/cart/cart.component.ts b/src/app/store/cart/cart.component.ts
index 29f59fd..4f7ba4d 100644
--- a/src/app/store/cart/cart.component.ts
+++ b/src/app/store/cart/cart.component.ts
@@ -1,6 +1,8 @@
 import {Component} from '@angular/core';
 import {LocalStorage} from 'webstorage-decorators';
 import {access} from 'fs';
+import {Http} from '../../../../node_modules/@angular/http';
+import {Router} from '../../../../node_modules/@angular/router';
 
 @Component({
   selector: 'cart',
@@ -16,7 +18,17 @@ export class CartComponent {
   province: string;
   postal: string;
 
-  constructor() {}
+  constructor(private http: Http, private router: Router) {}
+
+  async checkout() {
+    let cart = this.cart.map(row => {
+      return {id: row.id, quantity: row.quantity};
+    });
+    let link = await this.http
+      .post('https://us-central1-fhsons-7e90b.cloudfunctions.net/checkout', {cart: cart})
+      .toPromise();
+    window.location.href = link.url;
+  }
 
   remove(i: number) {
     let c = this.cart;