Building a WooCommerce REST API Mobile App

Recently I updated my WP Ionic project to include WooCommerce REST API support, just for fun.
It’s become a pretty cool little app, so I thought I’d share it along with some things I learned. Here’s the tl;dr:

• It’s fast, really fast
• Variable products, shipping, and payments are the pain points
• There are pros and cons to this approach

Demo Video:

This project uses the WooCommerce REST API v2, Ionic 3.9.2, and the WP-API. Github link (Setup instructions are in the readme)

The Pros and Cons of This Approach

First, why would you want to build a WooCommerce app when you have a mobile website? Besides the obvious reason of being on the app store, here’s a few benefits:

• It’s really fast, way faster than your website.
• The user experience is awesome, which could mean higher conversions.
• It works offline or in places with a poor network connection.
• It can be used as a native mobile app, or a progressive web app.

There are also cons to this type of app, so it’s not for everyone. There are 2 major drawbacks to using the REST API in an app:

• None of your customizations or plugins work in the app (custom checkout fields for example) You can customize the app, it just doesn’t automatically mimic your existing site.
• You have to custom code payment gateways. The WC REST API does not support payments, so you have to do that yourself.

One solution to these problems is using an iframe to display your checkout, which would automatically use any customizations you made on your site. There are some big downsides to that approach, you lose some of the offline functionality and it’s a worse checkout experience.
I decided to go full API with this project, mostly for fun. It allows for more offline support, faster checkout, and a better overall user experience.

Working with the WooCommerce REST API

Here’s a few tips if you are working with this API.
The biggest pain points are variable products, shipping, and payment gateways. The API makes these things difficult to handle, and in the case of payments it does not handle them at all.
I wrote about how to handle Stripe payments, and you can look at the code in my project for variable products and shipping. I haven’t handled these very elegantly, so I plan on making improvements to those soon.
Enjoy!