shopify
Build Shopify applications, extensions, and themes using GraphQL/REST APIs, Shopify CLI, Polaris UI components, and Liquid templating. Capabilities include app development with OAuth authentication, checkout UI extensions for customizing checkout flow, admin UI extensions for dashboard integration,
By mrgoonie · 445 installs
npx skills add mrgoonie/claudekit-skills --skill shopify
Source repository · Upstream listing
Shopify Development
Comprehensive guide for building on Shopify platform: apps, extensions, themes, and API integrations.
Platform Overview
Core Components:
Shopify CLI Development workflow tool
GraphQL Admin API Primary API for data operations (recommended)
REST Admin API Legacy API (maintenance mode)
Polaris UI Design system for consistent interfaces
Liquid Template language for themes
Extension Points:
Checkout UI Customize checkout experience
Admin UI Extend admin dashboard
POS UI Point of Sale customization
Customer Account Post purchase pages
Theme App Extensions Embedded theme functionality
Quick Start
Prerequisites
Create New App
Theme Development
Development Workflow
1. App Development
Setup:
Configure Access Scopes ( shopify.app.toml ):
Start Development:
Add Extensions:
Deploy:
2. Extension Development
Available Types:
Checkout UI checkout ui extension
Admin Action admin action
Admin Block admin block
POS UI pos ui extension
Function function (discounts, payment, delivery, validation)
Workflow:
3. Theme Development
Setup:
Local Development:
Deployment:
When to Build What
Build an App When:
Integrating external services
Adding functionality across multiple stores
Building merchant facing admin tools
Managing store data programmatically
Implementing complex business logic
Charging for functionality
Build an Extension When:
Customizing checkout flow
Adding fields/features to admin pages
Creating POS actions for retail
Implementing discount/payment/shipping rules
Extending customer account pages
Build a Theme When:
Creating custom storefront design
Building unique shopping experiences
Customizing product/collection pages
Implementing brand specific layouts
Modifying homepage/content pages
Combination Approach:
App + Theme Extension:
App handles backend logic and data
Theme extension provides storefront UI
Example: Product reviews, wishlists, size guides
Essential Patterns
GraphQL Product Query
Checkout Extension (React)
Liquid Product Display
Best Practices
API Usage:
Prefer GraphQL over REST for new development
Request only needed fields to reduce costs
Implement pagination for large datasets
Use bulk operations for batch processing
Respect rate limits (cost based for GraphQL)
Security:
Store API credentials in environment variables
Verify webhook signatures
Use OAuth for public apps
Request minimal access scopes
Implement session tokens for embedded apps
Performance:
Cache API responses when appropriate
Optimize images in themes
Minimize Liquid logic complexity
Use async loading for extensions
Monitor query costs in GraphQL
Testing:
Use development stores for testing
Test across different store plans
Verify mobile responsiveness
Check accessibility (keyboard, screen readers)
Validate GDPR compliance
Reference Documentation
Detailed guides for advanced topics:
[App Development](references/app development.md) OAuth, APIs, webhooks, billing
[Extensions](references/extensions.md) Checkout, Admin, POS, Functions
[Themes](references/themes.md) Liquid, sections, deployment
Scripts
[shopify init.py](scripts/shopify init.py) Initialize Shopify projects interactively
Troubleshooting
Rate Limit Errors:
Monitor X Shopify Shop Api Call Limit header
Implement exponential backoff
Use bulk operations for large datasets
Authentication Failures:
Verify access token validity
Check required scopes granted
Ensure OAuth flow completed
Extension Not Appearing:
Verify extension target correct
Check extension published
Ensure app installed on store
Webhook Not Receiving:
Verify webhook URL accessible
Check signature validation
Review logs in Partner Dashboard
Resources
Official Documentation:
Shopify Docs: https://shopify.dev/docs
GraphQL API: https://shopify.dev/docs/api/admin graphql
Shopify CLI: https://shopify.dev/docs/api/shopify cli
Polaris: https://polaris.shopify.com
Tools:
GraphiQL Explorer (Admin → Settings → Apps → Develop apps)
Partner Dashboard (app management)
Development stores (free testing)
API Versioning:
Quarterly releases (YYYY MM format)
Current: 2025 01
12 month support per version
Test before version updates
Note: This skill covers Shopify platform as of January 2025. Refer to official documentation for latest updates.