I want to make a shopify theme using react.
You have a bunch of template files that have access to global server-side variables with liquid e.g. {{ product.title }}. Think wordpress or any other theme-based system.
/theme
| <script> | |
| var products = [] | |
| {% for product in collections.all.products %} | |
| var product = {{ product | json }}; | |
| {% assign tags = product.tags | join: "," %} | |
| {% if product.metafields.subscriptions != blank %} | |
| product["subscription_product_id"] = {{ product.metafields.subscriptions.discount_product_id }}; | |
| product["subscription"] = {% if tags contains "Portal Subscription" %}true{% else %}false{% endif %} | |
| product["onetime"] = {% if tags contains "Portal One Time" %}true{% else %}false{% endif %} | |
| {% else %} |
| <!DOCTYPE html> | |
| <html lang="{{ locale }}" dir="{{ direction }}" class="{{ checkout_html_classes }}"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, height=device-height, minimum-scale=1.0, user-scalable=0"> | |
| <meta name="referrer" content="origin"> | |
| <title>{{ page_title }}</title> |
| { | |
| "items": [ | |
| { | |
| "id": 21602884747348, | |
| "properties": { | |
| "subscription_id": 190124, | |
| "shipping_interval_unit_type": "Months", | |
| "shipping_interval_frequency": 1, | |
| "Ongoing Subscription 1": "MjAzNDU3MjB8TWludCBHdW18NS41MHwx", | |
| "Ongoing Subscription 2": "MjAzNDU3MjV8U3BlYXJtaW50IEd1bXwxMC41MHwy" |
Since several people have asked I'll post how anyone can do this, and it's not actually that complicated since I've already gotten the apk file and so can share that.