--- title: "How to Build a Shopify App and Get Approved by the App Store" author: "Nate Laquis" author_role: "Founder & CEO" date: "2028-08-29" category: "How to Build" tags: - Shopify app development - Shopify Remix framework - Shopify App Store - ecommerce plugin development - Shopify Polaris UI excerpt: "Shopify has 4.6 million merchants and a partner ecosystem generating $2B+ in annual revenue. Here is how to build an app that passes review, attracts merchants, and generates recurring revenue." reading_time: "15 min read" canonical_url: "https://kanopylabs.com/blog/how-to-build-a-shopify-app" --- # How to Build a Shopify App and Get Approved by the App Store ## Shopify App Architecture in 2026 Shopify overhauled their app framework in 2024, and every new public app must follow the updated architecture. If you are working from older tutorials or boilerplate code, throw them out. Here is what matters now. Every Shopify app runs as an embedded web application inside the Shopify admin. The merchant installs your app, and it renders within an iframe in their Shopify dashboard. App Bridge (Shopify's JavaScript library) handles communication between your app and the Shopify admin, including navigation, modals, and resource pickers. The official framework is Remix (the full-stack React framework from the React Router team). Shopify's CLI generates a Remix project with authentication, session management, and API client pre-configured. You can technically use other frameworks, but you will spend weeks reimplementing what Shopify gives you for free in the Remix template. Your app's frontend uses Polaris, Shopify's React component library. Polaris components match the Shopify admin's look and feel, so your app feels native rather than bolted on. Using Polaris is mandatory for embedded apps and saves you from building common UI patterns from scratch. ![Developer setting up a Shopify app project with Remix and Polaris](https://images.unsplash.com/photo-1555949963-ff9fe0c870eb?w=800&q=80) ## Setting Up Your Development Environment Getting started is straightforward with Shopify's CLI tooling. ### Step 1: Create a Partner Account Sign up at partners.shopify.com. This is free and gives you access to development stores (unlimited), the Partner Dashboard, and app management tools. Create a development store to test your app without needing a real merchant account. ### Step 2: Scaffold Your App Run **shopify app init** from the Shopify CLI. Choose the Remix template. The generated project includes: OAuth authentication flow, session storage (SQLite by default, swap to PostgreSQL for production), Shopify API client (GraphQL), App Bridge configuration, and Polaris component library. ### Step 3: Configure App Scopes Request only the API scopes your app needs. Requesting unnecessary scopes (like read_customers when you only need read_products) will get your app rejected during review. Common scopes: read_products, write_products, read_orders, read_inventory. Each additional scope increases the merchant's trust barrier during installation. ### Step 4: Set Up Ngrok or Cloudflare Tunnel Shopify apps need a publicly accessible URL for OAuth callbacks and webhooks during development. The Shopify CLI includes a tunnel, or use Cloudflare Tunnel for a more stable development experience. Expect to spend a few hours getting the tunnel configuration right, especially if you are behind a corporate firewall. ### Step 5: Database Setup The Remix template uses SQLite for development, which is fine for local testing. For production, migrate to PostgreSQL on Supabase, Neon, or Railway. You need to store: merchant session data, app-specific settings per store, and any cached Shopify data your app uses frequently. ## Building Core Features with the Shopify API Shopify's GraphQL Admin API is your primary interface to merchant data. Here are the key integration patterns you will use. ### Product Management Reading and modifying products is the most common Shopify API operation. The GraphQL API lets you query products with variants, images, and metafields in a single request. Use bulk operations for stores with 10,000+ products to avoid rate limit issues. Shopify's rate limiting uses a leaky bucket algorithm with 50 points per second for public apps. Complex queries cost more points, so optimize your queries to request only the fields you need. ### Webhook Subscriptions Register webhooks for events your app cares about: orders/create, products/update, app/uninstalled, and the mandatory compliance webhooks (customers/data_request, customers/redact, shop/redact). Webhook delivery is not guaranteed, so implement idempotent handlers and periodic reconciliation jobs that check for missed events. ### Metafields Metafields let you store custom data on Shopify resources (products, orders, customers). Use them to attach your app's data to Shopify objects without maintaining a separate mapping table. Define metafield definitions through the API to get type validation and admin UI integration for free. ### Shopify Functions For apps that customize checkout behavior (discounts, shipping rates, payment customization), Shopify Functions run server-side WebAssembly code at checkout. They execute in under 5ms and replace the older Script Editor. Build Functions in Rust or JavaScript (compiled to Wasm). The performance constraints are strict, but Functions let you modify checkout behavior that was previously impossible for third-party apps. ![Ecommerce checkout flow with Shopify app integration and payment processing](https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?w=800&q=80) ## Billing and Monetization Shopify handles subscription billing through their Billing API. This simplifies payment collection but comes with trade-offs. ### How Shopify Billing Works You create a recurring charge through the API, Shopify presents a confirmation screen to the merchant, and once approved, Shopify bills the merchant and pays you (minus their revenue share) every 30 days. You never handle credit cards or payment processing directly. ### Revenue Share Shopify takes 20% of your first $1M in app revenue, then 15% after that. This is significant but buys you distribution, billing infrastructure, and merchant trust. For context, Apple and Google take 30% on mobile app stores. The Shopify cut is painful but fair given what you get. ### Pricing Strategy The most successful Shopify apps use tiered pricing: a free plan to drive installs and reviews, a basic paid plan ($9 to $29/month) for small merchants, a professional plan ($49 to $99/month) with advanced features, and an enterprise plan ($199 to $499/month) for Shopify Plus stores. Usage-based pricing (per order processed, per email sent) works well for apps where value scales with merchant volume. ### Free Trial Best Practices Offer a 7 to 14 day free trial on paid plans. Shopify's Billing API supports trial periods natively. During the trial, merchants must experience your app's core value proposition at least once. If your app's setup takes longer than the trial period, you have lost the conversion opportunity. ## Theme App Extensions and Storefront Integration If your app needs to render content on the merchant's storefront (product reviews, size guides, announcement bars, product recommendations), you build theme app extensions. ### App Blocks App blocks are reusable UI components that merchants can add to their theme using the Shopify theme editor. They render as web components and work across all Online Store 2.0 themes. Build app blocks with Liquid (Shopify's templating language), JavaScript, and CSS. Each block declares its schema (configurable settings) and renders within the theme's layout. ### App Embeds App embeds inject functionality site-wide without requiring the merchant to add a block to a specific page. Use them for floating widgets (chat buttons, notification pop-ups), analytics scripts, or global CSS overrides. Embeds activate with a single toggle in the theme editor. ### Performance Requirements Shopify measures your app's impact on storefront performance. Apps that add more than 200ms to page load time or increase Largest Contentful Paint by more than 100ms will be flagged during review. Lazy load everything, minimize JavaScript bundle size, and avoid blocking the main thread. Use Shopify's Web Performance dashboard in Partner Dashboard to monitor your impact. Building extensions that work well across ecommerce themes requires careful testing. If you have built [ecommerce applications](/blog/how-to-build-an-ecommerce-app) before, you know how varied merchant storefronts can be in terms of layout, CSS, and JavaScript conflicts. ## Passing the App Store Review The Shopify App Store review is rigorous. Plan for 2 to 6 weeks and at least one round of revisions. Here is what the review team evaluates. ### Functionality Requirements - The app must provide clear value and work as described in the listing - All features mentioned in the listing must be functional (no "coming soon" features) - The onboarding flow must guide merchants to first value without external documentation - Error states must be handled gracefully with helpful messages ### Security and Privacy - All data transmission over HTTPS - Compliance webhooks (GDPR) must be implemented and functional - Privacy policy URL must be provided and accessible - Data collection must be limited to what the app actually needs ### Quality Standards - Polaris components used correctly for embedded app UI - No broken links, missing images, or console errors - Responsive design that works on all screen sizes - Loading states for async operations (no blank screens while data loads) ### Listing Quality - Clear, accurate app description without excessive keyword stuffing - Professional screenshots showing the app in action - Demo video (optional but strongly recommended for approval) - Accurate pricing information with feature breakdowns per tier Submit early and expect feedback. The review team provides specific, actionable feedback when they request changes. Address every point thoroughly before resubmitting. ![Analytics dashboard showing Shopify app performance metrics and merchant adoption](https://images.unsplash.com/photo-1460925895917-afdab827c52f?w=800&q=80) ## Growth Strategy and Next Steps Getting approved is the starting line, not the finish line. Here is how successful Shopify apps grow. ### Ranking in App Store Search Shopify App Store search weighs: relevance to the search query, number and quality of reviews, install velocity, and retention rate. The most controllable factor is reviews. Ask satisfied merchants for reviews after they have used the app for 14+ days and experienced value. One 5-star review in your first week is worth more than ten reviews three months later. ### Content Marketing for Merchants Create content that helps your target merchants succeed, not just content about your app. A product review app should publish guides on "how to get more product reviews" and "how reviews impact conversion rates." This attracts merchants through organic search and positions your app as the obvious solution. ### Shopify Community and Events Participate in the Shopify Community forums, attend Shopify Editions announcements, and build relationships with other app developers. Cross-promotion between complementary apps (a reviews app partnering with a loyalty app) drives qualified installs from merchants who already trust the Shopify ecosystem. ### Merchant Support Responsive support is your best growth lever. Shopify merchants talk to each other. One merchant who gets great support tells three others. One merchant who gets ignored leaves a 1-star review that tanks your rankings. Budget for dedicated support from day one, even if it is just you responding to every message within 4 hours. Ready to build your Shopify app? [Book a free strategy call](/get-started) and we will help you identify the right niche, plan your feature set, and get to App Store approval as efficiently as possible. --- *Originally published on [Kanopy Labs](https://kanopylabs.com/blog/how-to-build-a-shopify-app)*