{"id":287233,"url":"\/orders-api-walkthrough\/","layout":"standard","version":"2022-12-23T09:54:20.000000Z","blocks":[{"id":2159360,"type":"banner","published":1,"size":{"x":12,"y":0},"order":0,"items":[],"properties":{"type":{"id":40061549,"value":"slim"},"title":{"id":40061550,"value":"Orders API: JavaScript guide"},"copy":{"id":40061551,"value":"Get JS snippets and read our demo app walkthrough"},"titleColor":{"id":40061552,"value":"#{banner.title.color}"},"titleBackground":{"id":40061553,"value":"#{banner.title.background.color}"},"copyColor":{"id":40061554,"value":"#{banner.copy.color}"},"copyBackground":{"id":40061555,"value":"#{banner.copy.background.color}"},"contentWidth":{"id":40061556,"value":"95%"},"textShadow":{"id":40061557,"value":"#{banner.text.shadow}"},"borderRadius":{"id":40061558,"value":"0px"},"buttonBorderRadius":{"id":40061559,"value":"#{button.border.radius}"},"buttonBackgroundColor":{"id":40061560,"value":"#{button.primary.color}"},"buttonStyle":{"id":40061561,"value":"secondary"},"buttonSize":{"id":40061562,"value":"standard"},"overlayOpacity":{"id":40061563,"value":"0.15"},"overlayColourStart":{"id":40061564,"value":"#000000"},"overlayColourEnd":{"id":40061565,"value":"#000000"},"overlayDirection":{"id":40061566,"value":"90"},"image":{"id":40061567,"value":"#{image.default}"},"video":{"id":40061568,"value":null},"videoThumbnail":{"id":40061569,"value":null},"media":{"id":40061570,"value":"image"},"align":{"id":40061571,"value":"center"},"verticalAlignment":{"id":40061572,"value":"center"},"font":{"id":40061573,"value":"#{heading1.font}"},"actions":{"id":40061574,"value":"[{\"text\":null,\"href\":null},{\"text\":null,\"href\":null}]"},"template":{"id":40061575,"value":"banner"},"padding":{"id":40061576,"value":"6"},"fullWidth":{"id":40061577,"value":"1"},"fullBackgroundColor":{"id":40061578,"value":"#{banner.fullBackground.color}"},"published":{"id":40061579,"value":"1"},"conditions":{"id":40061580,"value":"[]"}}},{"id":2159361,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":1,"items":[],"properties":{"html":{"id":40061581,"value":"<h2><strong>doodle2tee: Drawing to T-shirt Example<\/strong><\/h2><p><a target=\"_blank\" href=\"https:\/\/codepen.io\/Teemill\/pen\/ExLerwZ\" rel=\"noreferrer noopener\">doodle2tee <\/a>is a fun demo project that lets a user doodle on an HTML canvas and uses JavaScript to export a base64 image and send it to our API. The user is then redirected to the product page where they can buy their doodle on a tee.<\/p><p>Here's how we made it in under 20 minutes.<\/p>"},"borderRadius":{"id":40061582,"value":"#{text.border.radius}"},"textColor":{"id":40061583,"value":"#{text.color}"},"backgroundColour":{"id":40061584,"value":"#0000"},"truncateHeight":{"id":40061585,"value":null},"padding":{"id":40061587,"value":"9"},"fullWidth":{"id":40061588,"value":"0"},"fullBackgroundColor":{"id":40061589,"value":"#{text.fullBackground.color}"},"published":{"id":40061590,"value":"1"},"conditions":{"id":40061591,"value":"[]"},"template":{"id":40064683,"value":"text"}}},{"id":2159362,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":2,"items":[],"properties":{"html":{"id":40061592,"value":"<h2><strong>Walkthrough<\/strong><\/h2>"},"borderRadius":{"id":40061593,"value":"#{text.border.radius}"},"textColor":{"id":40061594,"value":"#{text.color}"},"backgroundColour":{"id":40061595,"value":"#0000"},"truncateHeight":{"id":40061596,"value":null},"padding":{"id":40061598,"value":"1"},"fullWidth":{"id":40061599,"value":"0"},"fullBackgroundColor":{"id":40061600,"value":"#{text.fullBackground.color}"},"published":{"id":40061601,"value":"1"},"conditions":{"id":40061602,"value":"[]"},"template":{"id":40064684,"value":"text"}}},{"id":2159363,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":4,"items":[],"properties":{"html":{"id":40061603,"value":"<pre><code class=\"language-js\">const projectName = 'teemill-234345';\nconst projectAuth = 'eyJ0eXAiOiJKV1QiLCJh....';<\/code><\/pre>"},"borderRadius":{"id":40061604,"value":"#{text.border.radius}"},"textColor":{"id":40061605,"value":"#{text.color}"},"backgroundColour":{"id":40061606,"value":"#0000"},"truncateHeight":{"id":40061607,"value":null},"padding":{"id":40061609,"value":"3"},"fullWidth":{"id":40061610,"value":"0"},"fullBackgroundColor":{"id":40061611,"value":"#{text.fullBackground.color}"},"published":{"id":40061612,"value":"1"},"conditions":{"id":40061613,"value":"[]"},"template":{"id":40151604,"value":"text"}}},{"id":2159364,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":6,"items":[],"properties":{"html":{"id":40061614,"value":"<pre><code class=\"language-javascript\">\/\/ Define a function for getting our products\nconst getProducts = async () =&gt; {\n  \/\/ Setup our http request configuration\n  const options = {\n    method: 'GET',\n    headers: {\n      'Content-Type': 'application\/json',\n      Authorization: projectAuth,\n    },\n  };\n\n  try {\n    \/\/ Send our request to the API and await it's response\n    const response = await fetch(`https:\/\/api.teemill.com\/v1\/catalog\/products?project=${projectName}`, options);\n\n    \/\/ All API responses are json so we must convert it into a javascript object.\n    const data = await response.json();\n\n    \/\/ Depending on your implemention you will need to implement pagination to retrieve more than 10 products. \n    \/\/ However for this example the first 10 products will be ok.\n    return data.products;\n  } catch (err) {\n    console.error(err);\n  }\n};<\/code><\/pre>"},"borderRadius":{"id":40061615,"value":"#{text.border.radius}"},"textColor":{"id":40061616,"value":"#{text.color}"},"backgroundColour":{"id":40061617,"value":"#0000"},"truncateHeight":{"id":40061618,"value":null},"padding":{"id":40061620,"value":"3"},"fullWidth":{"id":40061621,"value":"0"},"fullBackgroundColor":{"id":40061622,"value":"#{text.fullBackground.color}"},"published":{"id":40061623,"value":"1"},"conditions":{"id":40061624,"value":"[]"},"template":{"id":40151616,"value":"text"}}},{"id":2159365,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":10,"items":[],"properties":{"html":{"id":40061625,"value":"<pre><code class=\"language-js\">\/\/ Define a function for creating a new order\nconst createOrder = async (orderData) =&gt; {\n  \/\/ Setup our http request configuration\n  const options = {\n    method: 'POST',\n    headers: {\n      'Content-Type': 'application\/json',\n      Authorization: projectAuth,\n    },\n    body: JSON.stringify(orderData),\n  };\n\n  try {\n    \/\/ Send our request to the API and await it's response\n    const response = await fetch(`${baseUrl}\/v1\/orders?project=${projectName}`, options);\n\n    \/\/ All API responses are json so we must convert it into a javascript object.\n    const data = await response.json()\n\n    \/\/ Check the status code of the response.\n    \/\/ If the order was created successfully a 201 response code will be returned.\n    switch (response.status) {\n      \/\/ Order was successfully created, we can return the order from the function.\n      case 201:\n        return data;\n\n      \/\/ Check for validation errors.\n      case 400:\n        throw new Error(data.message);\n\n      \/\/ Check for any further unknown server errors we might need to handle.\n      default:\n        throw new Error('Unknown Error');\n    }\n  } catch (err) {\n    console.error(err);\n  }\n};<\/code><\/pre>"},"borderRadius":{"id":40061626,"value":"#{text.border.radius}"},"textColor":{"id":40061627,"value":"#{text.color}"},"backgroundColour":{"id":40061628,"value":"#0000"},"truncateHeight":{"id":40061629,"value":null},"padding":{"id":40061631,"value":"3"},"fullWidth":{"id":40061632,"value":"0"},"fullBackgroundColor":{"id":40061633,"value":"#{text.fullBackground.color}"},"published":{"id":40061634,"value":"1"},"conditions":{"id":40061635,"value":"[]"},"template":{"id":40151640,"value":"text"}}},{"id":2159544,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":30,"items":[],"properties":{"html":{"id":40064685,"value":"<pre><code class=\"language-js\">{\n  id: '97fade50-74aa-4d48-b98b-16368c16e478',\n  ref: 'https:\/\/api.teemill.com:443\/v1\/orders\/97fade50-74aa-4d48-b98b-16368c16e478',\n  status: 'new',\n  items: [\n    {\n      id: '97fade50-8d20-4997-ba8e-39eb5e6a037d',\n      variantRef: 'https:\/\/api.teemill.com:443\/v1\/variants\/2e18f50f-6f25-11ed-a9b4-4201c0a8a0e3',\n      quantity: 1,\n      ...\n    }\n  ],\n  fulfillments: [\n    {\n      id: '97fade51-8c7d-4fc4-94a9-b1457ccfa55d',\n      status: 'new',\n      items: [\n        {\n          orderItemId: '97fade50-8d20-4997-ba8e-39eb5e6a037d',\n          quantity: 1\n        }\n      ],\n      availableShippingMethods: [\n        {\n          id: 'bc1df18f-148c-47c6-b9ab-39faf56ece88',\n          name: 'UK Standard Royal Mail',\n          ...\n        },\n      ],\n      shippingMethod: {\n        id: 'a7183bcb-06e2-409c-9e1f-6b6339c9d301',\n        name: 'No Shipping Required',\n        ...\n      }\n    }\n  ],\n  ...\n}<\/code><\/pre>"},"borderRadius":{"id":40064686,"value":"#{text.border.radius}"},"textColor":{"id":40064687,"value":"#{text.color}"},"backgroundColour":{"id":40064688,"value":"#0000"},"truncateHeight":{"id":40064689,"value":null},"padding":{"id":40064691,"value":"6"},"fullWidth":{"id":40064692,"value":"0"},"fullBackgroundColor":{"id":40064693,"value":"#{text.fullBackground.color}"},"published":{"id":40064694,"value":"1"},"conditions":{"id":40064695,"value":"[]"},"template":{"id":40151830,"value":"text"}}},{"id":2159752,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":12,"items":[],"properties":{"html":{"id":40068612,"value":"<pre><code class=\"language-js\">\/\/ Define a function for confirming an order\nconst confirmOrder = async (order, confirmationData) =&gt; {\n  \/\/ Setup our http request configuration\n  const options = {\n    method: 'POST',\n    headers: {\n      'Content-Type': 'application\/json',\n      Authorization: projectAuth,\n    },\n    body: JSON.stringify(confirmationData),\n  };\n\n  try {\n    \/\/ Send our request to the API and await it's response\n    const response = await fetch(`${baseUrl}\/v1\/orders\/${order.id}\/confirm?project=${projectName}`, options);\n\n    \/\/ All API responses are json so we must convert it into a javascript object.\n    const data = await response.json()\n\n    \/\/ Check the status code of the response.\n    \/\/ If the order was created successfully a 201 response code will be returned.\n    switch (response.status) {\n      \/\/ Order was successfully confirmed, we can return the updated order from the function.\n      case 200:\n        return data;\n\n      \/\/ Check for validation errors.\n      case 400:\n        throw new Error(data.message);\n\n      \/\/ Check for any further unknown server errors we might need to handle.\n      default:\n        throw new Error('Unknown Error');\n    }\n  } catch (err) {\n    console.error(err);\n  }\n};<\/code><\/pre>"},"borderRadius":{"id":40068613,"value":"#{text.border.radius}"},"textColor":{"id":40068614,"value":"#{text.color}"},"backgroundColour":{"id":40068615,"value":"#0000"},"truncateHeight":{"id":40068616,"value":null},"padding":{"id":40068618,"value":"6"},"fullWidth":{"id":40068619,"value":"0"},"fullBackgroundColor":{"id":40068620,"value":"#{text.fullBackground.color}"},"published":{"id":40068621,"value":"1"},"conditions":{"id":40068622,"value":"[]"},"template":{"id":40151652,"value":"text"}}},{"id":2160188,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":16,"items":[],"properties":{"html":{"id":40078269,"value":"<pre><code class=\"language-js\">products = [\n  {\n    id: 'c9d0e054-6cd3-11ed-a9b4-4124c0a8a0e3',\n    ref: 'https:\/\/api.teemill.com:443\/v1\/products\/c9d0e054-6cd3-11ed-a9b4-4124c0a8a0e3',\n    title: 'Example Product',\n    description: 'This is an example product',\n    slug: 'example-1',\n    tags: [],\n    createdAt: '2018-05-25T19:39:22.000000Z',\n    updatedAt: '2022-12-01T14:52:50.000000Z',\n    publishedAt: '2018-05-25T19:39:22.000000Z',\n    images: [],\n    variants: [\n      {\n        id: '2e18f859-6f25-11ed-a9b4-3234c0a8a0e3',\n        ref: 'https:\/\/api.teemill.com:443\/v1\/variants\/2e18f859-6f25-11ed-a9b4-3234c0a8a0e3',\n        sku: null,\n        sortOrder: 0,\n        attributes: [\n          { name: 'Size', value: 'M' },\n          { name: 'Colour', value: 'White' }\n        ],\n        retailPrice: { amount: 19, currencyCode: 'GBP' },\n        salePrice: { amount: 0, currencyCode: 'GBP' },\n        price: { amount: 13.5, currencyCode: 'GBP' },\n        stock: { level: 1097 },\n        createdAt: '2022-12-14T16:55:01.425280Z',\n        updatedAt: '2022-12-14T16:55:01.425302Z',\n        publishedAt: '2022-12-14T16:55:01.425315Z'\n      }\n    ]\n  }\n]<\/code><\/pre>"},"borderRadius":{"id":40078270,"value":"#{text.border.radius}"},"textColor":{"id":40078271,"value":"#{text.color}"},"backgroundColour":{"id":40078272,"value":"#0000"},"truncateHeight":{"id":40078273,"value":null},"padding":{"id":40078275,"value":"6"},"fullWidth":{"id":40078276,"value":"0"},"fullBackgroundColor":{"id":40078277,"value":"#{text.fullBackground.color}"},"published":{"id":40078278,"value":"1"},"conditions":{"id":40078279,"value":"[]"},"template":{"id":40151686,"value":"text"}}},{"id":2160189,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":40,"items":[],"properties":{"html":{"id":40078281,"value":"<pre><code class=\"language-js\">{\n  id: '97fade50-74aa-4d48-b98b-16368c16e478',\n  ref: 'https:\/\/api.teemill.com:443\/v1\/orders\/97fade50-74aa-4d48-b98b-16368c16e478',\n  status: 'paid',\n  items: [\n    {\n      id: '97fade50-8d20-4997-ba8e-39eb5e6a037d',\n      variantRef: 'https:\/\/api.teemill.com:443\/v1\/variants\/2e18f50f-6f25-11ed-a9b4-4201c0a8a0e3',\n      quantity: 1,\n      ...\n    }\n  ],\n  fulfillments: [\n    {\n      id: '97fade51-8c7d-4fc4-94a9-b1457ccfa55d',\n      status: 'new',\n      items: [\n        {\n          orderItemId: '97fade50-8d20-4997-ba8e-39eb5e6a037d',\n          quantity: 1\n        }\n      ],\n      availableShippingMethods: [\n        {\n          id: 'bc1df18f-148c-47c6-b9ab-39faf56ece88',\n          name: 'UK Standard Royal Mail',\n          ...\n        },\n      ],\n      shippingMethod: {\n        id: 'bc1df18f-148c-47c6-b9ab-39faf56ece88',\n        name: 'UK Standard Royal Mail',\n        ...\n      }\n    }\n  ],\n  ...\n}<\/code><\/pre>"},"borderRadius":{"id":40078282,"value":"#{text.border.radius}"},"textColor":{"id":40078283,"value":"#{text.color}"},"backgroundColour":{"id":40078284,"value":"#0000"},"truncateHeight":{"id":40078285,"value":null},"padding":{"id":40078287,"value":"6"},"fullWidth":{"id":40078288,"value":"0"},"fullBackgroundColor":{"id":40078289,"value":"#{text.fullBackground.color}"},"published":{"id":40078290,"value":"1"},"conditions":{"id":40078291,"value":"[]"},"template":{"id":40152558,"value":"text"}}},{"id":2160386,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":8,"items":[],"properties":{"html":{"id":40082507,"value":"<pre><code class=\"language-js\">const getOrder = async (orderRef) =&gt; {\n  const options = {\n    method: 'GET',\n    headers: {\n      'Content-Type': 'application\/json',\n      Authorization: projectAuth,\n    },\n  };\n\n  try {\n    const response = await fetch(`${orderRef}?project=${projectName}`, options);\n\n    const data = await response.json();\n\n    switch (response.status) {\n      case 200:\n        return data;\n\n      default:\n        throw new Error('Unknown Error');\n    }\n  } catch (err) {\n    console.error(err);\n  }\n};<\/code><\/pre>"},"borderRadius":{"id":40082508,"value":"#{text.border.radius}"},"textColor":{"id":40082509,"value":"#{text.color}"},"backgroundColour":{"id":40082510,"value":"#0000"},"truncateHeight":{"id":40082511,"value":null},"padding":{"id":40082513,"value":"3"},"fullWidth":{"id":40082514,"value":"0"},"fullBackgroundColor":{"id":40082515,"value":"#{text.fullBackground.color}"},"published":{"id":40082516,"value":"1"},"conditions":{"id":40082517,"value":"[]"},"template":{"id":40151628,"value":"text"}}},{"id":2163338,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":3,"items":[],"properties":{"html":{"id":40151593,"value":"<p>First we want to setup our authentication. For best security practice you'll want to retrieve these secrets from your applications env or other secure key storage. For simplisity in this example however we are just defining them statically.<\/p>"},"borderRadius":{"id":40151594,"value":"#{text.border.radius}"},"textColor":{"id":40151595,"value":"#{text.color}"},"backgroundColour":{"id":40151596,"value":"#0000"},"truncateHeight":{"id":40151597,"value":null},"template":{"id":40151598,"value":"text"},"padding":{"id":40151599,"value":"1"},"fullWidth":{"id":40151600,"value":"0"},"fullBackgroundColor":{"id":40151601,"value":"#{text.fullBackground.color}"},"published":{"id":40151602,"value":"1"},"conditions":{"id":40151603,"value":"[]"}}},{"id":2163339,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":5,"items":[],"properties":{"html":{"id":40151605,"value":"<p>Next, we'll create some functions that will interact with the API. To begin with we can start with a function to get a list available of products.<\/p>"},"borderRadius":{"id":40151606,"value":"#{text.border.radius}"},"textColor":{"id":40151607,"value":"#{text.color}"},"backgroundColour":{"id":40151608,"value":"#0000"},"truncateHeight":{"id":40151609,"value":null},"template":{"id":40151610,"value":"text"},"padding":{"id":40151611,"value":"1"},"fullWidth":{"id":40151612,"value":"0"},"fullBackgroundColor":{"id":40151613,"value":"#{text.fullBackground.color}"},"published":{"id":40151614,"value":"1"},"conditions":{"id":40151615,"value":"[]"}}},{"id":2163340,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":7,"items":[],"properties":{"html":{"id":40151617,"value":"<p>Next we add a function to fetch an order.<\/p>"},"borderRadius":{"id":40151618,"value":"#{text.border.radius}"},"textColor":{"id":40151619,"value":"#{text.color}"},"backgroundColour":{"id":40151620,"value":"#0000"},"truncateHeight":{"id":40151621,"value":null},"template":{"id":40151622,"value":"text"},"padding":{"id":40151623,"value":"1"},"fullWidth":{"id":40151624,"value":"0"},"fullBackgroundColor":{"id":40151625,"value":"#{text.fullBackground.color}"},"published":{"id":40151626,"value":"1"},"conditions":{"id":40151627,"value":"[]"}}},{"id":2163341,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":9,"items":[],"properties":{"html":{"id":40151629,"value":"<p>Next we add a function to create a new order and return the order that was created.<\/p>"},"borderRadius":{"id":40151630,"value":"#{text.border.radius}"},"textColor":{"id":40151631,"value":"#{text.color}"},"backgroundColour":{"id":40151632,"value":"#0000"},"truncateHeight":{"id":40151633,"value":null},"template":{"id":40151634,"value":"text"},"padding":{"id":40151635,"value":"1"},"fullWidth":{"id":40151636,"value":"0"},"fullBackgroundColor":{"id":40151637,"value":"#{text.fullBackground.color}"},"published":{"id":40151638,"value":"1"},"conditions":{"id":40151639,"value":"[]"}}},{"id":2163342,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":11,"items":[],"properties":{"html":{"id":40151641,"value":"<p>Next we add a function to confirm an order which will take payment and start processing the order.<\/p>"},"borderRadius":{"id":40151642,"value":"#{text.border.radius}"},"textColor":{"id":40151643,"value":"#{text.color}"},"backgroundColour":{"id":40151644,"value":"#0000"},"truncateHeight":{"id":40151645,"value":null},"template":{"id":40151646,"value":"text"},"padding":{"id":40151647,"value":"1"},"fullWidth":{"id":40151648,"value":"0"},"fullBackgroundColor":{"id":40151649,"value":"#{text.fullBackground.color}"},"published":{"id":40151650,"value":"1"},"conditions":{"id":40151651,"value":"[]"}}},{"id":2163343,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":13,"items":[],"properties":{"html":{"id":40151653,"value":"<h3>Fetching your products<\/h3><p>1) Fetch our products and select a product variant we wish to order.<\/p>"},"borderRadius":{"id":40151654,"value":"#{text.border.radius}"},"textColor":{"id":40151655,"value":"#{text.color}"},"backgroundColour":{"id":40151656,"value":"#0000"},"truncateHeight":{"id":40151657,"value":null},"template":{"id":40151658,"value":"text"},"padding":{"id":40151659,"value":"1"},"fullWidth":{"id":40151660,"value":"0"},"fullBackgroundColor":{"id":40151661,"value":"#{text.fullBackground.color}"},"published":{"id":40151662,"value":"1"},"conditions":{"id":40151663,"value":"[]"}}},{"id":2163344,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":14,"items":[],"properties":{"html":{"id":40151664,"value":"<pre><code class=\"language-js\">const products = await getProducts();<\/code><\/pre>"},"borderRadius":{"id":40151665,"value":"#{text.border.radius}"},"textColor":{"id":40151666,"value":"#{text.color}"},"backgroundColour":{"id":40151667,"value":"#0000"},"truncateHeight":{"id":40151668,"value":null},"template":{"id":40151669,"value":"text"},"padding":{"id":40151670,"value":"3"},"fullWidth":{"id":40151671,"value":"0"},"fullBackgroundColor":{"id":40151672,"value":"#{text.fullBackground.color}"},"published":{"id":40151673,"value":"1"},"conditions":{"id":40151674,"value":"[]"}}},{"id":2163345,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":15,"items":[],"properties":{"html":{"id":40151675,"value":"<p>2) Response<\/p>"},"borderRadius":{"id":40151676,"value":"#{text.border.radius}"},"textColor":{"id":40151677,"value":"#{text.color}"},"backgroundColour":{"id":40151678,"value":"#0000"},"truncateHeight":{"id":40151679,"value":null},"template":{"id":40151680,"value":"text"},"padding":{"id":40151681,"value":"1"},"fullWidth":{"id":40151682,"value":"0"},"fullBackgroundColor":{"id":40151683,"value":"#{text.fullBackground.color}"},"published":{"id":40151684,"value":"1"},"conditions":{"id":40151685,"value":"[]"}}},{"id":2163346,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":17,"items":[],"properties":{"html":{"id":40151687,"value":"<h3>Creating a new order<\/h3><p>1) Select a product variant we wish to order.<\/p>"},"borderRadius":{"id":40151688,"value":"#{text.border.radius}"},"textColor":{"id":40151689,"value":"#{text.color}"},"backgroundColour":{"id":40151690,"value":"#0000"},"truncateHeight":{"id":40151691,"value":null},"template":{"id":40151692,"value":"text"},"padding":{"id":40151693,"value":"1"},"fullWidth":{"id":40151694,"value":"0"},"fullBackgroundColor":{"id":40151695,"value":"#{text.fullBackground.color}"},"published":{"id":40151696,"value":"1"},"conditions":{"id":40151697,"value":"[]"}}},{"id":2163347,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":18,"items":[],"properties":{"html":{"id":40151698,"value":"<pre><code class=\"language-js\">const variant = products[0].variants[0];<\/code><\/pre>"},"borderRadius":{"id":40151699,"value":"#{text.border.radius}"},"textColor":{"id":40151700,"value":"#{text.color}"},"backgroundColour":{"id":40151701,"value":"#0000"},"truncateHeight":{"id":40151702,"value":null},"template":{"id":40151703,"value":"text"},"padding":{"id":40151704,"value":"3"},"fullWidth":{"id":40151705,"value":"0"},"fullBackgroundColor":{"id":40151706,"value":"#{text.fullBackground.color}"},"published":{"id":40151707,"value":"1"},"conditions":{"id":40151708,"value":"[]"}}},{"id":2163348,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":19,"items":[],"properties":{"html":{"id":40151709,"value":"<p>2) Define the customers contact information.<\/p>"},"borderRadius":{"id":40151710,"value":"#{text.border.radius}"},"textColor":{"id":40151711,"value":"#{text.color}"},"backgroundColour":{"id":40151712,"value":"#0000"},"truncateHeight":{"id":40151713,"value":null},"template":{"id":40151714,"value":"text"},"padding":{"id":40151715,"value":"1"},"fullWidth":{"id":40151716,"value":"0"},"fullBackgroundColor":{"id":40151717,"value":"#{text.fullBackground.color}"},"published":{"id":40151718,"value":"1"},"conditions":{"id":40151719,"value":"[]"}}},{"id":2163349,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":20,"items":[],"properties":{"html":{"id":40151720,"value":"<pre><code class=\"language-js\">const contactInformation = {\n  email: 'john-smith@teemill.com',\n  phone: '+442087599036',\n};<\/code><\/pre>"},"borderRadius":{"id":40151721,"value":"#{text.border.radius}"},"textColor":{"id":40151722,"value":"#{text.color}"},"backgroundColour":{"id":40151723,"value":"#0000"},"truncateHeight":{"id":40151724,"value":null},"template":{"id":40151725,"value":"text"},"padding":{"id":40151726,"value":"3"},"fullWidth":{"id":40151727,"value":"0"},"fullBackgroundColor":{"id":40151728,"value":"#{text.fullBackground.color}"},"published":{"id":40151729,"value":"1"},"conditions":{"id":40151730,"value":"[]"}}},{"id":2163350,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":21,"items":[],"properties":{"html":{"id":40151731,"value":"<p>3) Define the shipping address for the order.<\/p>"},"borderRadius":{"id":40151732,"value":"#{text.border.radius}"},"textColor":{"id":40151733,"value":"#{text.color}"},"backgroundColour":{"id":40151734,"value":"#0000"},"truncateHeight":{"id":40151735,"value":null},"template":{"id":40151736,"value":"text"},"padding":{"id":40151737,"value":"1"},"fullWidth":{"id":40151738,"value":"0"},"fullBackgroundColor":{"id":40151739,"value":"#{text.fullBackground.color}"},"published":{"id":40151740,"value":"1"},"conditions":{"id":40151741,"value":"[]"}}},{"id":2163351,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":22,"items":[],"properties":{"html":{"id":40151742,"value":"<pre><code class=\"language-js\">const shippingAddress = {\n  contactName: 'John Smith',\n  company: 'Teemill Tech Ltd',\n  line1: 'Hooke Hill',\n  line2: '',\n  city: 'Freshwater',\n  postalCode: 'PO40 9BG',\n  country: 'GB',\n  state: 'Isle of Wight',\n};<\/code><\/pre>"},"borderRadius":{"id":40151743,"value":"#{text.border.radius}"},"textColor":{"id":40151744,"value":"#{text.color}"},"backgroundColour":{"id":40151745,"value":"#0000"},"truncateHeight":{"id":40151746,"value":null},"template":{"id":40151747,"value":"text"},"padding":{"id":40151748,"value":"3"},"fullWidth":{"id":40151749,"value":"0"},"fullBackgroundColor":{"id":40151750,"value":"#{text.fullBackground.color}"},"published":{"id":40151751,"value":"1"},"conditions":{"id":40151752,"value":"[]"}}},{"id":2163352,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":23,"items":[],"properties":{"html":{"id":40151753,"value":"<p>4) Define the items we wish to order, in our case we're using the variant we defined above.<\/p>"},"borderRadius":{"id":40151754,"value":"#{text.border.radius}"},"textColor":{"id":40151755,"value":"#{text.color}"},"backgroundColour":{"id":40151756,"value":"#0000"},"truncateHeight":{"id":40151757,"value":null},"template":{"id":40151758,"value":"text"},"padding":{"id":40151759,"value":"1"},"fullWidth":{"id":40151760,"value":"0"},"fullBackgroundColor":{"id":40151761,"value":"#{text.fullBackground.color}"},"published":{"id":40151762,"value":"1"},"conditions":{"id":40151763,"value":"[]"}}},{"id":2163353,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":24,"items":[],"properties":{"html":{"id":40151764,"value":"<pre><code class=\"language-js\">const items = [\n  {\n    variantRef: variant.ref,\n    quantity: 1,\n  }\n];<\/code><\/pre>"},"borderRadius":{"id":40151765,"value":"#{text.border.radius}"},"textColor":{"id":40151766,"value":"#{text.color}"},"backgroundColour":{"id":40151767,"value":"#0000"},"truncateHeight":{"id":40151768,"value":null},"template":{"id":40151769,"value":"text"},"padding":{"id":40151770,"value":"3"},"fullWidth":{"id":40151771,"value":"0"},"fullBackgroundColor":{"id":40151772,"value":"#{text.fullBackground.color}"},"published":{"id":40151773,"value":"1"},"conditions":{"id":40151774,"value":"[]"}}},{"id":2163354,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":25,"items":[],"properties":{"html":{"id":40151775,"value":"<p>5) Submit the order to the API and wait for a response.<\/p>"},"borderRadius":{"id":40151776,"value":"#{text.border.radius}"},"textColor":{"id":40151777,"value":"#{text.color}"},"backgroundColour":{"id":40151778,"value":"#0000"},"truncateHeight":{"id":40151779,"value":null},"template":{"id":40151780,"value":"text"},"padding":{"id":40151781,"value":"1"},"fullWidth":{"id":40151782,"value":"0"},"fullBackgroundColor":{"id":40151783,"value":"#{text.fullBackground.color}"},"published":{"id":40151784,"value":"1"},"conditions":{"id":40151785,"value":"[]"}}},{"id":2163355,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":26,"items":[],"properties":{"html":{"id":40151786,"value":"<pre><code class=\"language-js\">const order = await createOrder({\n  contactInformation,\n  shippingAddress,\n  items,\n});<\/code><\/pre>"},"borderRadius":{"id":40151787,"value":"#{text.border.radius}"},"textColor":{"id":40151788,"value":"#{text.color}"},"backgroundColour":{"id":40151789,"value":"#0000"},"truncateHeight":{"id":40151790,"value":null},"template":{"id":40151791,"value":"text"},"padding":{"id":40151792,"value":"3"},"fullWidth":{"id":40151793,"value":"0"},"fullBackgroundColor":{"id":40151794,"value":"#{text.fullBackground.color}"},"published":{"id":40151795,"value":"1"},"conditions":{"id":40151796,"value":"[]"}}},{"id":2163356,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":27,"items":[],"properties":{"html":{"id":40151797,"value":"<p>Request<\/p>"},"borderRadius":{"id":40151798,"value":"#{text.border.radius}"},"textColor":{"id":40151799,"value":"#{text.color}"},"backgroundColour":{"id":40151800,"value":"#0000"},"truncateHeight":{"id":40151801,"value":null},"template":{"id":40151802,"value":"text"},"padding":{"id":40151803,"value":"1"},"fullWidth":{"id":40151804,"value":"0"},"fullBackgroundColor":{"id":40151805,"value":"#{text.fullBackground.color}"},"published":{"id":40151806,"value":"1"},"conditions":{"id":40151807,"value":"[]"}}},{"id":2163357,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":28,"items":[],"properties":{"html":{"id":40151808,"value":"<pre><code class=\"language-js\">{\n  contactInformation: { email: 'john-smith@teemill.com', phone: '+442087599036' },\n  shippingAddress: {\n    contactName: 'John Smith',\n    company: '',\n    line1: '35 South St',\n    line2: '',\n    city: 'Newport',\n    postalCode: 'PO30 1JE',\n    country: 'GB',\n    state: 'Isle of Wight'\n  },\n  items: [\n    {\n      variantRef: 'https:\/\/api.teemill.com:443\/v1\/variants\/2e18f50f-6f25-11ed-a9b4-4201c0a8a0e3',\n      quantity: 1\n    }\n  ]\n}<\/code><\/pre>"},"borderRadius":{"id":40151809,"value":"#{text.border.radius}"},"textColor":{"id":40151810,"value":"#{text.color}"},"backgroundColour":{"id":40151811,"value":"#0000"},"truncateHeight":{"id":40151812,"value":null},"template":{"id":40151813,"value":"text"},"padding":{"id":40151814,"value":"3"},"fullWidth":{"id":40151815,"value":"0"},"fullBackgroundColor":{"id":40151816,"value":"#{text.fullBackground.color}"},"published":{"id":40151817,"value":"1"},"conditions":{"id":40151818,"value":"[]"}}},{"id":2163358,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":29,"items":[],"properties":{"html":{"id":40151819,"value":"<p>Response<\/p>"},"borderRadius":{"id":40151820,"value":"#{text.border.radius}"},"textColor":{"id":40151821,"value":"#{text.color}"},"backgroundColour":{"id":40151822,"value":"#0000"},"truncateHeight":{"id":40151823,"value":null},"template":{"id":40151824,"value":"text"},"padding":{"id":40151825,"value":"1"},"fullWidth":{"id":40151826,"value":"0"},"fullBackgroundColor":{"id":40151827,"value":"#{text.fullBackground.color}"},"published":{"id":40151828,"value":"1"},"conditions":{"id":40151829,"value":"[]"}}},{"id":2163404,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":31,"items":[],"properties":{"html":{"id":40152459,"value":"<h3>Confirming an order<\/h3><p>1) Fetch the order we want to confirm. In the example we will be using the order we created in the previous step.<\/p>"},"borderRadius":{"id":40152460,"value":"#{text.border.radius}"},"textColor":{"id":40152461,"value":"#{text.color}"},"backgroundColour":{"id":40152462,"value":"#0000"},"truncateHeight":{"id":40152463,"value":null},"template":{"id":40152464,"value":"text"},"padding":{"id":40152465,"value":"1"},"fullWidth":{"id":40152466,"value":"0"},"fullBackgroundColor":{"id":40152467,"value":"#{text.fullBackground.color}"},"published":{"id":40152468,"value":"1"},"conditions":{"id":40152469,"value":"[]"}}},{"id":2163405,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":32,"items":[],"properties":{"html":{"id":40152470,"value":"<pre><code class=\"language-js\">const order = await getOrder('https:\/\/api.teemill.com:443\/v1\/orders\/97fade50-74aa-4d48-b98b-16368c16e478');<\/code><\/pre>"},"borderRadius":{"id":40152471,"value":"#{text.border.radius}"},"textColor":{"id":40152472,"value":"#{text.color}"},"backgroundColour":{"id":40152473,"value":"#0000"},"truncateHeight":{"id":40152474,"value":null},"template":{"id":40152475,"value":"text"},"padding":{"id":40152476,"value":"3"},"fullWidth":{"id":40152477,"value":"0"},"fullBackgroundColor":{"id":40152478,"value":"#{text.fullBackground.color}"},"published":{"id":40152479,"value":"1"},"conditions":{"id":40152480,"value":"[]"}}},{"id":2163406,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":33,"items":[],"properties":{"html":{"id":40152481,"value":"<p>2) Define the confirmationData by selecting an available shipping method for each fulfillment in the order.<\/p>"},"borderRadius":{"id":40152482,"value":"#{text.border.radius}"},"textColor":{"id":40152483,"value":"#{text.color}"},"backgroundColour":{"id":40152484,"value":"#0000"},"truncateHeight":{"id":40152485,"value":null},"template":{"id":40152486,"value":"text"},"padding":{"id":40152487,"value":"1"},"fullWidth":{"id":40152488,"value":"0"},"fullBackgroundColor":{"id":40152489,"value":"#{text.fullBackground.color}"},"published":{"id":40152490,"value":"1"},"conditions":{"id":40152491,"value":"[]"}}},{"id":2163407,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":34,"items":[],"properties":{"html":{"id":40152492,"value":"<pre><code class=\"language-js\">const confirmationData = [\n  {\n    fulfillmentId: '97fade51-8c7d-4fc4-94a9-b1457ccfa55d',\n    shippingMethod: 'bc1df18f-148c-47c6-b9ab-39faf56ece88',\n  }\n];<\/code><\/pre>"},"borderRadius":{"id":40152493,"value":"#{text.border.radius}"},"textColor":{"id":40152494,"value":"#{text.color}"},"backgroundColour":{"id":40152495,"value":"#0000"},"truncateHeight":{"id":40152496,"value":null},"template":{"id":40152497,"value":"text"},"padding":{"id":40152498,"value":"3"},"fullWidth":{"id":40152499,"value":"0"},"fullBackgroundColor":{"id":40152500,"value":"#{text.fullBackground.color}"},"published":{"id":40152501,"value":"1"},"conditions":{"id":40152502,"value":"[]"}}},{"id":2163408,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":35,"items":[],"properties":{"html":{"id":40152503,"value":"<p>3) Submit the order to the API and wait for a response.<\/p>"},"borderRadius":{"id":40152504,"value":"#{text.border.radius}"},"textColor":{"id":40152505,"value":"#{text.color}"},"backgroundColour":{"id":40152506,"value":"#0000"},"truncateHeight":{"id":40152507,"value":null},"template":{"id":40152508,"value":"text"},"padding":{"id":40152509,"value":"1"},"fullWidth":{"id":40152510,"value":"0"},"fullBackgroundColor":{"id":40152511,"value":"#{text.fullBackground.color}"},"published":{"id":40152512,"value":"1"},"conditions":{"id":40152513,"value":"[]"}}},{"id":2163409,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":36,"items":[],"properties":{"html":{"id":40152514,"value":"<pre><code class=\"language-js\">const order = await confirmOrder({\n  order,\n  confirmationData,\n});<\/code><\/pre>"},"borderRadius":{"id":40152515,"value":"#{text.border.radius}"},"textColor":{"id":40152516,"value":"#{text.color}"},"backgroundColour":{"id":40152517,"value":"#0000"},"truncateHeight":{"id":40152518,"value":null},"template":{"id":40152519,"value":"text"},"padding":{"id":40152520,"value":"3"},"fullWidth":{"id":40152521,"value":"0"},"fullBackgroundColor":{"id":40152522,"value":"#{text.fullBackground.color}"},"published":{"id":40152523,"value":"1"},"conditions":{"id":40152524,"value":"[]"}}},{"id":2163410,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":37,"items":[],"properties":{"html":{"id":40152525,"value":"<p>Request<\/p>"},"borderRadius":{"id":40152526,"value":"#{text.border.radius}"},"textColor":{"id":40152527,"value":"#{text.color}"},"backgroundColour":{"id":40152528,"value":"#0000"},"truncateHeight":{"id":40152529,"value":null},"template":{"id":40152530,"value":"text"},"padding":{"id":40152531,"value":"1"},"fullWidth":{"id":40152532,"value":"0"},"fullBackgroundColor":{"id":40152533,"value":"#{text.fullBackground.color}"},"published":{"id":40152534,"value":"1"},"conditions":{"id":40152535,"value":"[]"}}},{"id":2163411,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":38,"items":[],"properties":{"html":{"id":40152536,"value":"<pre><code class=\"language-js\">[\n  {\n    fulfillmentId: '97fade51-8c7d-4fc4-94a9-b1457ccfa55d',\n    shippingMethodId: 'bc1df18f-148c-47c6-b9ab-39faf56ece88'\n  }\n]<\/code><\/pre>"},"borderRadius":{"id":40152537,"value":"#{text.border.radius}"},"textColor":{"id":40152538,"value":"#{text.color}"},"backgroundColour":{"id":40152539,"value":"#0000"},"truncateHeight":{"id":40152540,"value":null},"template":{"id":40152541,"value":"text"},"padding":{"id":40152542,"value":"3"},"fullWidth":{"id":40152543,"value":"0"},"fullBackgroundColor":{"id":40152544,"value":"#{text.fullBackground.color}"},"published":{"id":40152545,"value":"1"},"conditions":{"id":40152546,"value":"[]"}}},{"id":2163412,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":39,"items":[],"properties":{"html":{"id":40152547,"value":"<p>Response<\/p>"},"borderRadius":{"id":40152548,"value":"#{text.border.radius}"},"textColor":{"id":40152549,"value":"#{text.color}"},"backgroundColour":{"id":40152550,"value":"#0000"},"truncateHeight":{"id":40152551,"value":null},"template":{"id":40152552,"value":"text"},"padding":{"id":40152553,"value":"1"},"fullWidth":{"id":40152554,"value":"0"},"fullBackgroundColor":{"id":40152555,"value":"#{text.fullBackground.color}"},"published":{"id":40152556,"value":"1"},"conditions":{"id":40152557,"value":"[]"}}}],"properties":{"title":{"id":40061546,"value":"Orders API Walkthrough"},"isStorePage":{"id":40061547,"value":"1"},"ogImage":{"id":40061548,"value":"https:\/\/images.podos.io\/9sovd2dxlsf2gvssvewgc5paeqjilkuxxzsp2ujlealf2jci.png.png?w=1200&h=auto"},"loginState":{"id":40565335,"value":"everyone"}},"labels":{"monitorCheckExcluded":"1"},"published":1,"sitemap":1,"divisionId":12,"edited":true}