{"id":"a94ae16f-5ce9-4ef1-b553-c3e4164c952f","shortId":"jTQz8v","kind":"skill","title":"Shopify Development","tagline":"Antigravity Awesome Skills skill by Sickn33","description":"# Shopify Development Skill\n\nUse this skill when the user asks about:\n\n- Building Shopify apps or extensions\n- Creating checkout/admin/POS UI customizations\n- Developing themes with Liquid templating\n- Integrating with Shopify GraphQL or REST APIs\n- Implementing webhooks or billing\n- Working with metafields or Shopify Functions\n\n---\n\n## ROUTING: What to Build\n\n**IF user wants to integrate external services OR build merchant tools OR charge for features:**\n→ Build an **App** (see `references/app-development.md`)\n\n**IF user wants to customize checkout OR add admin UI OR create POS actions OR implement discount rules:**\n→ Build an **Extension** (see `references/extensions.md`)\n\n**IF user wants to customize storefront design OR modify product/collection pages:**\n→ Build a **Theme** (see `references/themes.md`)\n\n**IF user needs both backend logic AND storefront UI:**\n→ Build **App + Theme Extension** combination\n\n---\n\n## Shopify CLI Commands\n\nInstall CLI:\n\n```bash\nnpm install -g @shopify/cli@latest\n```\n\nCreate and run app:\n\n```bash\nshopify app init          # Create new app\nshopify app dev           # Start dev server with tunnel\nshopify app deploy        # Build and upload to Shopify\n```\n\nGenerate extension:\n\n```bash\nshopify app generate extension --type checkout_ui_extension\nshopify app generate extension --type admin_action\nshopify app generate extension --type admin_block\nshopify app generate extension --type pos_ui_extension\nshopify app generate extension --type function\n```\n\nTheme development:\n\n```bash\nshopify theme init        # Create new theme\nshopify theme dev         # Start local preview at localhost:9292\nshopify theme pull --live # Pull live theme\nshopify theme push --development  # Push to dev theme\n```\n\n---\n\n## Access Scopes\n\nConfigure in `shopify.app.toml`:\n\n```toml\n[access_scopes]\nscopes = \"read_products,write_products,read_orders,write_orders,read_customers\"\n```\n\nCommon scopes:\n\n- `read_products`, `write_products` - Product catalog access\n- `read_orders`, `write_orders` - Order management\n- `read_customers`, `write_customers` - Customer data\n- `read_inventory`, `write_inventory` - Stock levels\n- `read_fulfillments`, `write_fulfillments` - Order fulfillment\n\n---\n\n## GraphQL Patterns (Validated against API 2026-01)\n\n### Query Products\n\n```graphql\nquery GetProducts($first: Int!, $query: String) {\n  products(first: $first, query: $query) {\n    edges {\n      node {\n        id\n        title\n        handle\n        status\n        variants(first: 5) {\n          edges {\n            node {\n              id\n              price\n              inventoryQuantity\n            }\n          }\n        }\n      }\n    }\n    pageInfo {\n      hasNextPage\n      endCursor\n    }\n  }\n}\n```\n\n### Query Orders\n\n```graphql\nquery GetOrders($first: Int!) {\n  orders(first: $first) {\n    edges {\n      node {\n        id\n        name\n        createdAt\n        displayFinancialStatus\n        totalPriceSet {\n          shopMoney {\n            amount\n            currencyCode\n          }\n        }\n      }\n    }\n  }\n}\n```\n\n### Set Metafields\n\n```graphql\nmutation SetMetafields($metafields: [MetafieldsSetInput!]!) {\n  metafieldsSet(metafields: $metafields) {\n    metafields {\n      id\n      namespace\n      key\n      value\n    }\n    userErrors {\n      field\n      message\n    }\n  }\n}\n```\n\nVariables example:\n\n```json\n{\n  \"metafields\": [\n    {\n      \"ownerId\": \"gid://shopify/Product/123\",\n      \"namespace\": \"custom\",\n      \"key\": \"care_instructions\",\n      \"value\": \"Handle with care\",\n      \"type\": \"single_line_text_field\"\n    }\n  ]\n}\n```\n\n---\n\n## Checkout Extension Example\n\n```tsx\nimport {\n  reactExtension,\n  BlockStack,\n  TextField,\n  Checkbox,\n  useApplyAttributeChange,\n} from \"@shopify/ui-extensions-react/checkout\";\n\nexport default reactExtension(\"purchase.checkout.block.render\", () => (\n  <GiftMessage />\n));\n\nfunction GiftMessage() {\n  const [isGift, setIsGift] = useState(false);\n  const [message, setMessage] = useState(\"\");\n  const applyAttributeChange = useApplyAttributeChange();\n\n  useEffect(() => {\n    if (isGift && message) {\n      applyAttributeChange({\n        type: \"updateAttribute\",\n        key: \"gift_message\",\n        value: message,\n      });\n    }\n  }, [isGift, message]);\n\n  return (\n    <BlockStack spacing=\"loose\">\n      <Checkbox checked={isGift} onChange={setIsGift}>\n        This is a gift\n      </Checkbox>\n      {isGift && (\n        <TextField\n          label=\"Gift Message\"\n          value={message}\n          onChange={setMessage}\n          multiline={3}\n        />\n      )}\n    </BlockStack>\n  );\n}\n```\n\n---\n\n## Liquid Template Example\n\n```liquid\n{% comment %} Product Card Snippet {% endcomment %}\n<div class=\"product-card\">\n  <a href=\"{{ product.url }}\">\n    {% if product.featured_image %}\n      <img\n        src=\"{{ product.featured_image | img_url: 'medium' }}\"\n        alt=\"{{ product.title | escape }}\"\n        loading=\"lazy\"\n      >\n    {% endif %}\n    <h3>{{ product.title }}</h3>\n    <p class=\"price\">{{ product.price | money }}</p>\n    {% if product.compare_at_price > product.price %}\n      <p class=\"sale-badge\">Sale</p>\n    {% endif %}\n  </a>\n</div>\n```\n\n---\n\n## Webhook Configuration\n\nIn `shopify.app.toml`:\n\n```toml\n[webhooks]\napi_version = \"2026-01\"\n\n[[webhooks.subscriptions]]\ntopics = [\"orders/create\", \"orders/updated\"]\nuri = \"/webhooks/orders\"\n\n[[webhooks.subscriptions]]\ntopics = [\"products/update\"]\nuri = \"/webhooks/products\"\n\n# GDPR mandatory webhooks (required for app approval)\n[webhooks.privacy_compliance]\ncustomer_data_request_url = \"/webhooks/gdpr/data-request\"\ncustomer_deletion_url = \"/webhooks/gdpr/customer-deletion\"\nshop_deletion_url = \"/webhooks/gdpr/shop-deletion\"\n```\n\n---\n\n## Best Practices\n\n### API Usage\n\n- Use GraphQL over REST for new development\n- Request only fields you need (reduces query cost)\n- Implement cursor-based pagination with `pageInfo.endCursor`\n- Use bulk operations for processing more than 250 items\n- Handle rate limits with exponential backoff\n\n### Security\n\n- Store API credentials in environment variables\n- Always verify webhook HMAC signatures before processing\n- Validate OAuth state parameter to prevent CSRF\n- Request minimal access scopes\n- Use session tokens for embedded apps\n\n### Performance\n\n- Cache API responses when data doesn't change frequently\n- Use lazy loading in extensions\n- Optimize images in themes using `img_url` filter\n- Monitor GraphQL query costs via response headers\n\n---\n\n## Troubleshooting\n\n**IF you see rate limit errors:**\n→ Implement exponential backoff retry logic\n→ Switch to bulk operations for large datasets\n→ Monitor `X-Shopify-Shop-Api-Call-Limit` header\n\n**IF authentication fails:**\n→ Verify the access token is still valid\n→ Check that all required scopes were granted\n→ Ensure OAuth flow completed successfully\n\n**IF extension is not appearing:**\n→ Verify the extension target is correct\n→ Check that extension is published via `shopify app deploy`\n→ Confirm the app is installed on the test store\n\n**IF webhook is not receiving events:**\n→ Verify the webhook URL is publicly accessible\n→ Check HMAC signature validation logic\n→ Review webhook logs in Partner Dashboard\n\n**IF GraphQL query fails:**\n→ Validate query against schema (use GraphiQL explorer)\n→ Check for deprecated fields in error message\n→ Verify you have required access scopes\n\n---\n\n## Reference Files\n\nFor detailed implementation guides, read these files:\n\n- `references/app-development.md` - OAuth authentication flow, GraphQL mutations for products/orders/billing, webhook handlers, billing API integration\n- `references/extensions.md` - Checkout UI components, Admin UI extensions, POS extensions, Shopify Functions for discounts/payment/delivery\n- `references/themes.md` - Liquid syntax reference, theme directory structure, sections and snippets, common patterns\n\n---\n\n## Scripts\n\n- `scripts/shopify_init.py` - Interactive project scaffolding. Run: `python scripts/shopify_init.py`\n- `scripts/shopify_graphql.py` - GraphQL utilities with query templates, pagination, rate limiting. Import: `from shopify_graphql import ShopifyGraphQL`\n\n---\n\n## Official Documentation Links\n\n- Shopify Developer Docs: https://shopify.dev/docs\n- GraphQL Admin API Reference: https://shopify.dev/docs/api/admin-graphql\n- Shopify CLI Reference: https://shopify.dev/docs/api/shopify-cli\n- Polaris Design System: https://polaris.shopify.com\n\nAPI Version: 2026-01 (quarterly releases, 12-month deprecation window)\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.\n\n## Limitations\n- Use this skill only when the task clearly matches the scope described above.\n- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.\n- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.","tags":["shopify","development","antigravity","awesome","skills","sickn33"],"capabilities":["skill","source-sickn33","category-antigravity-awesome-skills"],"categories":["antigravity-awesome-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/sickn33/antigravity-awesome-skills/shopify-development","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"install_from":"skills.sh"}},"qualityScore":"0.300","qualityRationale":"deterministic score 0.30 from registry signals: · indexed on skills.sh · published under sickn33/antigravity-awesome-skills","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill:v1","enrichmentVersion":1,"enrichedAt":"2026-04-25T11:40:39.270Z","embedding":null,"createdAt":"2026-04-18T20:31:34.277Z","updatedAt":"2026-04-25T11:40:39.270Z","lastSeenAt":"2026-04-25T11:40:39.270Z","tsv":"'-01':296,483,845 '/docs':824 '/docs/api/admin-graphql':831 '/docs/api/shopify-cli':837 '/webhooks/gdpr/customer-deletion':512 '/webhooks/gdpr/data-request':508 '/webhooks/gdpr/shop-deletion':516 '/webhooks/orders':489 '/webhooks/products':494 '12':848 '2026':295,482,844 '250':550 '3':450 '5':319 '9292':222 'access':238,244,265,581,652,710,744 'action':88,183,864 'add':82 'admin':83,182,189,772,826 'alway':565 'amount':346 'antigrav':3 'api':40,294,480,519,560,591,643,766,827,842 'app':22,72,124,142,145,149,151,159,170,178,185,192,200,500,588,687,691 'appear':673 'applic':858 'applyattributechang':414,420 'approv':501 'ask':18,902 'authent':648,757 'awesom':4 'backend':118 'backoff':557,628 'base':539 'bash':133,143,168,207 'best':517 'bill':44,765 'block':190 'blockstack':392 'boundari':910 'build':20,54,63,70,93,109,123,161 'bulk':544,633 'cach':590 'call':644 'card':457 'care':375,380 'catalog':264 'category-antigravity-awesome-skills' 'chang':597 'charg':67 'check':432,657,680,711,733 'checkbox':394,431 'checkout':80,174,386,769 'checkout/admin/pos':26 'clarif':904 'clear':877 'cli':129,132,833 'combin':127 'command':130 'comment':455 'common':257,791 'complet':667 'complianc':503 'compon':771 'configur':240,475 'confirm':689 'const':404,409,413 'correct':679 'cost':535,615 'creat':25,86,139,147,211 'createdat':342 'credenti':561 'criteria':913 'csrf':578 'currencycod':347 'cursor':538 'cursor-bas':537 'custom':28,79,102,256,273,275,276,373,504,509 'dashboard':721 'data':277,505,594 'dataset':637 'default':399 'delet':510,514 'deploy':160,688 'deprec':735,850 'describ':865,881 'design':104,839 'detail':749 'dev':152,154,216,236 'develop':2,10,29,206,233,527,820 'directori':786 'discount':91 'discounts/payment/delivery':780 'displayfinancialstatus':343 'doc':821 'document':817 'doesn':595 'edg':311,320,338 'embed':587 'endcom':459 'endcursor':327 'endif':463,473 'ensur':664 'environ':563,893 'environment-specif':892 'error':625,738 'event':703 'exampl':367,388,453 'execut':860 'expert':898 'explor':732 'exponenti':556,627 'export':398 'extens':24,95,126,167,172,176,180,187,194,198,202,387,603,670,676,682,774,776 'extern':60 'fail':649,725 'fals':408 'featur':69 'field':364,385,530,736 'file':747,754 'filter':611 'first':302,307,308,318,333,336,337 'flow':666,758 'frequent':598 'fulfil':285,287,289 'function':50,204,402,778 'g':136 'gdpr':495 'generat':166,171,179,186,193,201 'getord':332 'getproduct':301 'gift':424,439,443 'giftmessag':403 'grant':663 'graphiql':731 'graphql':37,290,299,330,350,522,613,723,759,802,813,825 'guid':751 'handl':315,378,552 'handler':764 'hasnextpag':326 'header':618,646 'hmac':568,712 'id':313,322,340,359 'imag':462,605 'img':609 'implement':41,90,536,626,750 'import':390,810,814 'init':146,210 'input':907 'instal':131,135,693 'instruct':376 'int':303,334 'integr':34,59,767 'interact':795 'inventori':279,281 'inventoryquant':324 'isgift':405,418,428,433,440 'item':551 'json':368 'key':361,374,423 'label':442 'larg':636 'latest':138 'lazi':600 'level':283 'limit':554,624,645,809,869 'line':383 'link':818 'liquid':32,451,454,782 'live':226,228 'load':601 'local':218 'localhost':221 'log':718 'logic':119,630,715 'manag':271 'mandatori':496 'match':878 'merchant':64 'messag':365,410,419,425,427,429,444,446,739 'metafield':47,349,353,356,357,358,369 'metafieldsset':355 'metafieldssetinput':354 'minim':580 'miss':915 'modifi':106 'money':466 'monitor':612,638 'month':849 'multilin':449 'mutat':351,760 'name':341 'namespac':360,372 'need':116,532 'new':148,212,526 'node':312,321,339 'npm':134 'oauth':573,665,756 'offici':816 'onchang':434,447 'oper':545,634 'optim':604 'order':252,254,267,269,270,288,329,335 'orders/create':486 'orders/updated':487 'output':887 'overview':868 'ownerid':370 'page':108 'pageinfo':325 'pageinfo.endcursor':542 'pagin':540,807 'paramet':575 'partner':720 'pattern':291,792 'perform':589 'permiss':908 'polari':838 'polaris.shopify.com':841 'pos':87,196,775 'practic':518 'prevent':577 'preview':219 'price':323,470 'process':547,571 'product':248,250,260,262,263,298,306,456 'product.compare':468 'product.featured':461 'product.price':465,471 'product.title':464 'product/collection':107 'products/orders/billing':762 'products/update':492 'project':796 'public':709 'publish':684 'pull':225,227 'purchase.checkout.block.render':401 'push':232,234 'python':799 'quarter':846 'queri':297,300,304,309,310,328,331,534,614,724,727,805 'rate':553,623,808 'reactextens':391,400 'read':247,251,255,259,266,272,278,284,752 'receiv':702 'reduc':533 'refer':746,784,828,834 'references/app-development.md':74,755 'references/extensions.md':97,768 'references/themes.md':113,781 'releas':847 'request':506,528,579 'requir':498,660,743,906 'respons':592,617 'rest':39,524 'retri':629 'return':430 'review':716,899 'rout':51 'rule':92 'run':141,798 'safeti':909 'sale':472 'scaffold':797 'schema':729 'scope':239,245,246,258,582,661,745,880 'script':793 'scripts/shopify_graphql.py':801 'scripts/shopify_init.py':794,800 'section':788 'secur':558 'see':73,96,112,622 'server':155 'servic':61 'session':584 'set':348 'setisgift':406,435 'setmessag':411,448 'setmetafield':352 'shop':513,642 'shopifi':1,9,21,36,49,128,144,150,158,165,169,177,184,191,199,208,214,223,230,641,686,777,812,819,832 'shopify.app.toml':242,477 'shopify.dev':823,830,836 'shopify.dev/docs':822 'shopify.dev/docs/api/admin-graphql':829 'shopify.dev/docs/api/shopify-cli':835 'shopify/cli':137 'shopify/product/123':371 'shopify/ui-extensions-react/checkout':397 'shopifygraphql':815 'shopmoney':345 'sickn33':8 'signatur':569,713 'singl':382 'skill':5,6,11,14,856,872 'snippet':458,790 'source-sickn33' 'specif':894 'start':153,217 'state':574 'status':316 'still':655 'stock':282 'stop':900 'store':559,697 'storefront':103,121 'string':305 'structur':787 'substitut':890 'success':668,912 'switch':631 'syntax':783 'system':840 'target':677 'task':876 'templat':33,452,806 'test':696,896 'text':384 'textfield':393,441 'theme':30,111,125,205,209,213,215,224,229,231,237,607,785 'titl':314 'token':585,653 'toml':243,478 'tool':65 'topic':485,491 'totalpriceset':344 'treat':885 'troubleshoot':619 'tsx':389 'tunnel':157 'type':173,181,188,195,203,381,421 'ui':27,84,122,175,197,770,773 'updateattribut':422 'upload':163 'uri':488,493 'url':507,511,515,610,707 'usag':520 'use':12,521,543,583,599,608,730,854,870 'useapplyattributechang':395,415 'useeffect':416 'user':17,56,76,99,115 'usererror':363 'usest':407,412 'util':803 'valid':292,572,656,714,726,895 'valu':362,377,426,445 'variabl':366,564 'variant':317 'verifi':566,650,674,704,740 'version':481,843 'via':616,685 'want':57,77,100 'webhook':42,474,479,497,567,699,706,717,763 'webhooks.privacy':502 'webhooks.subscriptions':484,490 'window':851 'work':45 'workflow':862 'write':249,253,261,268,274,280,286 'x':640 'x-shopify-shop-api-call-limit':639","prices":[{"id":"132d736b-0c23-416c-8630-7ed05c5c06da","listingId":"a94ae16f-5ce9-4ef1-b553-c3e4164c952f","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"sickn33","category":"antigravity-awesome-skills","install_from":"skills.sh"},"createdAt":"2026-04-18T20:31:34.277Z"}],"sources":[{"listingId":"a94ae16f-5ce9-4ef1-b553-c3e4164c952f","source":"github","sourceId":"sickn33/antigravity-awesome-skills/shopify-development","sourceUrl":"https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/shopify-development","isPrimary":false,"firstSeenAt":"2026-04-18T21:44:52.082Z","lastSeenAt":"2026-04-25T06:52:00.008Z"},{"listingId":"a94ae16f-5ce9-4ef1-b553-c3e4164c952f","source":"skills_sh","sourceId":"sickn33/antigravity-awesome-skills/shopify-development","sourceUrl":"https://skills.sh/sickn33/antigravity-awesome-skills/shopify-development","isPrimary":true,"firstSeenAt":"2026-04-18T20:31:34.277Z","lastSeenAt":"2026-04-25T11:40:39.270Z"}],"details":{"listingId":"a94ae16f-5ce9-4ef1-b553-c3e4164c952f","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"sickn33","slug":"shopify-development","source":"skills_sh","category":"antigravity-awesome-skills","skills_sh_url":"https://skills.sh/sickn33/antigravity-awesome-skills/shopify-development"},"updatedAt":"2026-04-25T11:40:39.270Z"}}