Claude MarketplacesSubmit
davila7 avatar

Shopify Apps

davila7/claude-code-templates

This covers the essential patterns for building modern Shopify apps with React Router, App Bridge for embedded admin experiences, and secure webhook handling with HMAC verification. The sharp edges section is especially useful, steering you away from REST APIs toward GraphQL for new development, warning about webhook response timing (respond immediately, process async), and reminding you about GDPR handler requirements. The anti-patterns call out common mistakes like polling instead of webhooks and processing webhooks before responding. If you're building a Shopify app from scratch or modernizing an existing one, this gives you the architectural guardrails to avoid the most common pitfalls around API choice, embedding, and compliance.

skills.sh installs
254
GitHub stars
33.2K
last updated
Aug 21, 2026
View on GitHub

Install

$ npx -y skills add davila7/claude-code-templates --skill shopify-apps --agent claude-code

Installs into .claude/skills of the current project.

Files

Shopify Apps

Patterns

React Router App Setup

Modern Shopify app template with React Router

Embedded App with App Bridge

Render app embedded in Shopify Admin

Webhook Handling

Secure webhook processing with HMAC verification

Anti-Patterns

❌ REST API for New Apps

❌ Webhook Processing Before Response

❌ Polling Instead of Webhooks

⚠️ Sharp Edges

IssueSeveritySolution
Issuehigh## Respond immediately, process asynchronously
Issuehigh## Check rate limit headers
Issuehigh## Request protected customer data access
Issuemedium## Use TOML only (recommended)
Issuemedium## Handle both URL formats
Issuehigh## Use GraphQL for all new code
Issuehigh## Use latest App Bridge via script tag
Issuehigh## Implement all GDPR handlers
SKILL.md on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthlyAgent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any language

Details

Repository
github.com/davila7/claude-code-templates
Categories
Frontend Development, Backend & APIs
First seen
Jun 3, 2026

More from davila7/claude-code-templates

All 618

Recommended

More Frontend Development
1community-access avatarframework-accessibilitycommunity-access/accessibility-agentsFramework-specific accessibility patterns and fix templates for React, Vue, Angular, Svelte, Next.js, and Tailwind CSS.250skills.sh installs
2josiahsiegel avatartailwindcss-advanced-componentsjosiahsiegel/claude-plugin-marketplaceTailwind CSS advanced component patterns with CVA (class-variance-authority) and variant management. PROACTIVELY activate for: (1) building reusable component v250skills.sh installs
3nexu-io avataremail-marketingnexu-io/open-designA brand product-launch email — masthead with wordmark, hero image block, headline lockup with skewed-italic accent, body copy, primary CTA, and a specifications249skills.sh installs
4nucliweb avatarwebperf-resourcesnucliweb/webperf-snippetsIntelligent network quality analysis with adaptive loading strategies. Detects connection type (2g/3g/4g), bandwidth, RTT, and save-data mode, then automaticall249skills.sh installs
5andrelandgraf avatarog-image-generationandrelandgraf/fullstackrecipesGenerate dynamic social preview images using Next.js file conventions and the next/og library. Server-rendered JSX images cached at build time.245skills.sh installs
6uxjoseph avatarsupanova-design-engineuxjoseph/supanova-design-skillSupanova Landing Page Design Engine. Generates premium, conversion-optimized landing pages using pure HTML + Tailwind CSS (CDN). Overrides default LLM biases to245skills.sh installs