shopify-apps_skill

Overview

This skill provides an opinionated, security-first starter for building Shopify apps with Remix, the Shopify App framework, Admin GraphQL API, and checkout UI extensions. It focuses on spec-driven initialization, session storage with Prisma, GDPR webhook handling, and a Polaris-based admin UI. Use it to scaffold a production-ready app structure and implement secure API, webhook, and extension patterns quickly.

How this skill works

The skill scaffolds a Remix app configured for Shopify: authentication flows, Prisma session storage, Admin API helpers, and webhook routes for lifecycle and GDPR events. It wires Shopify CLI configuration (shopify.app.toml), registers required webhooks, enforces authenticated admin loaders/actions, and provides example GraphQL queries, mutations, and metafield helpers. A Polaris layout and checkout extension template are included to speed UI and extension development.

When to use it

• Starting a new Shopify app using Remix and TypeScript/JavaScript.
• You need secure, production-ready auth and session handling (Prisma session storage).
• Implementing Admin GraphQL operations and metafield-based app settings.
• Adding checkout UI or theme extensions alongside an embedded admin UI.
• Preparing an app for App Store approval with GDPR and lifecycle webhooks.

Best practices

• Keep Shopify API keys and secrets in environment variables and do not commit them.
• Use Prisma session storage and delete sessions on app/uninstall webhooks to avoid stale data.
• Handle GDPR webhooks explicitly: customers/data_request, customers/redact, shop/redact.
• Prefer GraphQL Admin API (remove REST) and centralize queries/mutations with error handling for userErrors.
• Use Polaris for consistent embedded admin UI and store settings as JSON metafields for portability.

Example use cases

• Scaffold a Remix-based Shopify app that authenticates shops and exposes a settings page stored in shop metafields.
• Implement product listing and creation using Admin GraphQL queries and mutations wrapped with loader/action patterns.
• Add a checkout UI extension to customize cart experience, bundled under extensions/ with shopify.extension.toml.
• Respond to app/uninstalled webhook to remove sessions and perform cleanup for App Store compliance.
• Implement GDPR webhook handlers to return/delete customer data and remove app-related metafields on shop/redact.