shopify-developer
$
npx mdskill add tech-leads-club/agent-skills/shopify-developerComprehensive reference for professional Shopify development - API version **2026-01**.
SKILL.md
.github/skills/shopify-developerView on GitHub ↗
---
name: shopify-developer
description: Complete Shopify development reference covering Liquid templating, OS 2.0 themes, GraphQL APIs, Hydrogen, Functions, and performance optimization (API v2026-01). Use when working with .liquid files, building Shopify themes or apps, writing GraphQL queries for Shopify, debugging Liquid errors, creating app extensions, migrating from Scripts to Functions, or building headless storefronts. Triggers on "Shopify", "Liquid template", "Hydrogen", "Storefront API", "theme development", "Shopify Functions", "Polaris". Do NOT use for non-Shopify e-commerce platforms.
---
# Shopify Developer Reference
Comprehensive reference for professional Shopify development - API version **2026-01**.
## Quick Reference
| Item | Value |
| ---------------- | ------------------------------------------------------------------- |
| API version | `2026-01` (stable) |
| GraphQL Admin | `POST https://{store}.myshopify.com/admin/api/2026-01/graphql.json` |
| Storefront API | `POST https://{store}.myshopify.com/api/2026-01/graphql.json` |
| Ajax API (theme) | `/cart.js`, `/cart/add.js`, `/cart/change.js` |
| CLI install | `npm install -g @shopify/cli` |
| Theme dev | `shopify theme dev --store {store}.myshopify.com` |
| App dev | `shopify app dev` |
| Deploy | `shopify app deploy` |
| Docs | [shopify.dev](https://shopify.dev) |
## Choose Your Path
Read the reference file(s) that match your task:
**Liquid templating** - writing or debugging `.liquid` files:
- [references/liquid-syntax.md](references/liquid-syntax.md) - Tags, control flow, iteration, whitespace, LiquidDoc
- [references/liquid-filters.md](references/liquid-filters.md) - All filter categories with examples
- [references/liquid-objects.md](references/liquid-objects.md) - Product, collection, cart, customer, and global objects
**Theme development** - building or customising themes:
- [references/theme-development.md](references/theme-development.md) - OS 2.0 architecture, sections, blocks, JSON templates, settings schema
**API integration** - fetching or modifying data programmatically:
- [references/api-admin.md](references/api-admin.md) - GraphQL Admin API (primary), REST (legacy), OAuth, webhooks, rate limiting
- [references/api-storefront.md](references/api-storefront.md) - Storefront API, Ajax API, cart operations
**App development** - building Shopify apps:
- [references/app-development.md](references/app-development.md) - Shopify CLI, extensions, Polaris Web Components, App Bridge
**Serverless logic** - custom business rules:
- [references/functions.md](references/functions.md) - Shopify Functions (replacing Scripts), Rust/JS targets, deployment
**Headless commerce** - custom storefronts:
- [references/hydrogen.md](references/hydrogen.md) - Hydrogen framework, React Router 7, Storefront API integration
**Optimisation and troubleshooting**:
- [references/performance.md](references/performance.md) - Images, JS, CSS, fonts, Liquid, Core Web Vitals
- [references/debugging.md](references/debugging.md) - Liquid errors, API errors, cart issues, webhook failures
## Deprecation Notices
| Deprecated | Replacement | Deadline |
| --------------------- | ---------------------- | ---------------------------------------- |
| Shopify Scripts | Shopify Functions | August 2025 (migration), sundown TBD |
| checkout.liquid | Checkout Extensibility | August 2024 (Plus), done |
| REST Admin API | GraphQL Admin API | Active deprecation (no removal date yet) |
| Legacy custom apps | New auth model | January 2025 (done) |
| Polaris React | Polaris Web Components | Active migration |
| Remix (app framework) | React Router 7 | Hydrogen 2025.5.0+ |
## Liquid Essentials
Three syntax types:
```liquid
{{ product.title | upcase }} {# Output with filter #}
{% if product.available %}In stock{% endif %} {# Logic tag #}
{% assign sale = product.price | times: 0.8 %} {# Assignment #}
{%- if condition -%}Stripped whitespace{%- endif -%}
```
Key patterns:
```liquid
{% for product in collection.products limit: 5 %}
{% render 'product-card', product: product %}
{% endfor %}
{% paginate collection.products by 12 %}
{% for product in paginate.collection.products %}...{% endfor %}
{{ paginate | default_pagination }}
{% endpaginate %}
```
## API Essentials
```javascript
// GraphQL Admin - always use GraphQL over REST
const response = await fetch(`https://${store}.myshopify.com/admin/api/2026-01/graphql.json`, {
method: 'POST',
headers: {
'X-Shopify-Access-Token': accessToken,
'Content-Type': 'application/json',
},
body: JSON.stringify({ query, variables }),
})
const { data, errors } = await response.json()
if (errors) throw new Error(errors[0].message)
// Ajax API (theme-only cart operations)
fetch('/cart/add.js', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ id: variantId, quantity: 1 }),
})
```
## Reference Files
| File | Lines | Coverage |
| ------------------------------------------------------- | ----- | ------------------------------------------------------------------------------ |
| [liquid-syntax.md](references/liquid-syntax.md) | ~600 | Tags, control flow, iteration, variables, whitespace, LiquidDoc |
| [liquid-filters.md](references/liquid-filters.md) | ~870 | String, numeric, array, Shopify-specific, date, URL, colour filters |
| [liquid-objects.md](references/liquid-objects.md) | ~695 | All Shopify objects: product, variant, collection, cart, customer, order, etc. |
| [theme-development.md](references/theme-development.md) | ~1200 | File structure, JSON templates, sections, blocks, settings schema, layout |
| [api-admin.md](references/api-admin.md) | ~595 | GraphQL queries/mutations, REST (legacy), OAuth, webhooks, rate limiting |
| [api-storefront.md](references/api-storefront.md) | ~235 | Storefront API, Ajax API, cart operations, Customer Account API |
| [app-development.md](references/app-development.md) | ~760 | CLI, app architecture, extensions, Polaris Web Components, deployment |
| [functions.md](references/functions.md) | ~300 | Function types, Rust/JS targets, CLI workflow, Scripts migration |
| [hydrogen.md](references/hydrogen.md) | ~375 | Setup, routing, data loading, Storefront API, deployment |
| [performance.md](references/performance.md) | ~605 | Images, JS, CSS, fonts, Liquid, third-party scripts, Core Web Vitals |
| [debugging.md](references/debugging.md) | ~650 | Liquid, JavaScript, API, cart, webhook, theme editor troubleshooting |
More from tech-leads-club/agent-skills
- ai-cold-outreachWhen the user wants to build an AI-powered outreach system, write cold emails, improve deliverability, or scale personalized outreach. Also use when the user mentions 'cold email,' 'cold outreach,' 'outreach automation,' 'Instantly,' 'Smartlead,' 'Clay,' 'email sequences,' 'deliverability,' 'personalization at scale,' 'reply rate,' or 'outreach stack.' This skill covers the complete AI cold outreach system from signal detection through conversion. Do NOT use for technical implementation, code review, or software architecture.
- ai-pricingWhen the user wants to price an AI product, choose a charge metric, design pricing tiers, or optimize margins. Also use when the user mentions 'AI pricing,' 'usage-based pricing,' 'consumption pricing,' 'outcome pricing,' 'BYOK,' 'bring your own key,' 'per-seat pricing,' 'pricing tiers,' 'AI margins,' 'cost per token,' or 'pricing model.' This skill covers pricing strategy, packaging, and margin management for AI-native products. Do NOT use for technical implementation, code review, or software architecture.
- ai-sdrWhen the user wants to deploy AI sales development reps, automate sales qualification, build signal-to-action routing, or design AI agent architecture for sales. Also use when the user mentions 'AI SDR,' 'AI sales agent,' 'automated qualification,' 'signal routing,' 'sales automation,' '11x,' 'Artisan,' 'AiSDR,' 'AI BDR,' or 'autonomous sales.' This skill covers AI SDR deployment, qualification automation, and agent architecture for sales development. Do NOT use for technical implementation, code review, or software architecture.
- ai-seoWhen the user wants to build programmatic SEO with AI, create competitor alternative pages, optimize for AI Overviews, or scale content production. Also use when the user mentions 'SEO,' 'programmatic SEO,' 'AI content,' 'competitor alternative pages,' 'AI Overviews,' 'search optimization,' 'DataForSEO,' 'content at scale,' 'keyword strategy,' or 'organic traffic.' This skill covers AI-powered SEO strategy from keyword research through programmatic page generation. Do NOT use for technical implementation, code review, or software architecture.
- ai-ugc-adsWhen the user wants to create UGC ad campaigns, recruit UGC creators, generate AI UGC content, or scale with user-generated content. Also use when the user mentions 'UGC,' 'user-generated content,' 'creator ads,' 'Spark Ads,' 'whitelisting,' 'AI UGC,' 'Arcads,' 'Creatify,' 'creator brief,' or 'UGC testing.' This skill covers the UGC growth framework from creator recruitment through AI-powered scaling. Do NOT use for technical implementation, code review, or software architecture.
- aws-advisorExpert AWS Cloud Advisor for architecture design, security review, and implementation guidance. Leverages AWS MCP tools for accurate, documentation-backed answers. Use when user asks about AWS architecture, security, service selection, migrations, troubleshooting, or learning AWS. Triggers on AWS, Lambda, S3, EC2, ECS, EKS, DynamoDB, RDS, CloudFormation, CDK, Terraform, Serverless, SAM, IAM, VPC, API Gateway, or any AWS service. Do NOT use for non-AWS cloud providers or general infrastructure without AWS context.
- best-practicesApply modern web development best practices for security, compatibility, and code quality. Use when asked to "apply best practices", "security audit", "modernize code", "code quality review", or "check for vulnerabilities". Do NOT use for accessibility (use web-accessibility), SEO (use seo), performance (use core-web-vitals), or comprehensive multi-area audits (use web-quality-audit).
- chrome-devtoolsBrowser debugging, performance profiling, and automation via Chrome DevTools MCP. Use when user says "debug this page", "take a screenshot", "check network requests", "profile performance", "inspect console errors", or "analyze page load". Do NOT use for full E2E test suites (use playwright-skill) or non-browser debugging.
- cloudflare-deployDeploy applications and infrastructure to Cloudflare using Workers, Pages, and related platform services. Use when the user asks to deploy, host, publish, or set up a project on Cloudflare. Do NOT use for deploying to Vercel, Netlify, or Render (use their respective skills).
- codenaviYour pathfinder for navigating unknown codebases. Investigates with precision, implements surgically, and never assumes — if it doesn't know, it says so. Maintains a .notebook/ knowledge base that grows across sessions, turning every discovery into lasting intelligence. Summons available skills, MCPs, and docs when the mission demands. Use when fixing bugs, implementing features, refactoring, investigating flows, or any development task in unfamiliar territory. Triggers on "fix this", "implement this", "how does this work", "investigate this flow", "help me with this code". Do NOT use for greenfield scaffolding, CI/CD, or infrastructure provisioning.