# shopify-apps

Supplies Claude Code with development patterns for Shopify apps, covering React Router, App Bridge integration, webhook HMAC verification, and GraphQL.

- skill · `type=skill` · Claude Code · 224 installs
- Author: davila7
- License: not stated · policy=link-only · description only; the file stays with the author
- Source: https://github.com/davila7/claude-code-templates/tree/HEAD/cli-tool/components/skills/web-development/shopify-apps
- Updated: 2026-10-24
- HTML: https://affpapa.org/en/nevibecode/skills/shopify-apps

## What it does

This skill guides Claude Code through building modern Shopify apps. It establishes workflows for embedded admin views with App Bridge, secure HMAC checking on incoming webhooks, and Polaris UI integration.

The skill explicitly flags common architectural mistakes. It rejects REST endpoints in favor of the GraphQL Admin API and forbids polling where webhooks are appropriate. Incoming webhooks must return an immediate HTTP status before asynchronous background tasks run. It also enforces GDPR compliance endpoints and rate limit tracking.

## Install

### Claude Code (native platform)

1. **claude-code-templates**
```bash
npx claude-code-templates@latest --skill web-development/shopify-apps
```

2. **Skills CLI (Vercel)**
```bash
npx skills add davila7/claude-code-templates --skill shopify-apps -a claude-code
```

3. **Manually: put the files in place**
- File: `~/.claude/skills/shopify-apps/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/shopify-apps/

### Codex

**Manually: put the files in place**
- File: `.agents/skills/shopify-apps/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

**Manually: put the files in place**
- File: `.cursor/skills/shopify-apps/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install davila7/claude-code-templates shopify-apps
```

2. **Manually: put the files in place**
- File: `.github/skills/shopify-apps/SKILL.md`

### Gemini CLI

**Platform CLI**
```bash
gemini skills install https://github.com/davila7/claude-code-templates --path cli-tool/components/skills/web-development/shopify-apps
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/shopify-apps/SKILL.md` — The legacy .windsurf/skills/ path still works

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/davila7/claude-code-templates/tree/HEAD/cli-tool/components/skills/web-development/shopify-apps

## When to use it
- scaffold an embedded Shopify app using React Router and App Bridge
- verify HMAC signatures on incoming Shopify webhooks
- implement required GDPR compliance webhook endpoints
- replace legacy REST API calls with GraphQL Admin queries

## Example prompts
- Set up HMAC verification for incoming Shopify order webhooks
- Scaffold an embedded Shopify admin app with React Router and App Bridge
- Show the required GDPR compliance handlers for our Shopify app

## Similar
- [frontend-design](https://affpapa.org/en/nevibecode/skills/frontend-design.md) — skill · 1025790 installs
- [design-taste-frontend](https://affpapa.org/en/nevibecode/skills/design-taste-frontend.md) — skill · 678700 installs
- [prototype](https://affpapa.org/en/nevibecode/skills/prototype.md) — skill · 986201 installs
- [hyperframes](https://affpapa.org/en/nevibecode/skills/heygen-com-hyperframes.md) — skill · 1200000 installs
- [hyperframes-cli](https://affpapa.org/en/nevibecode/skills/heygen-com-hyperframes-cli.md) — skill · 1300000 installs
- [webapp-testing](https://affpapa.org/en/nevibecode/skills/webapp-testing.md) — skill · 186758 installs

## Other versions with the same name
- [shopify-apps · sickn33](https://affpapa.org/en/nevibecode/skills/sickn33-shopify-apps.md) — 1000 installs

From the same set: [davila7/claude-code-templates](https://affpapa.org/en/nevibecode/by/davila7/claude-code-templates.md) — 804 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md