← Back to Portfolio
Muhammad Nawaz
Case Study 04

Shopify Integrations & Custom App Development

Connecting commerce infrastructure to scale merchant operations

Shopify API Integration Custom Apps Liquid Node.js
12+ Apps Built
3x Faster Checkout
99.9% Uptime

Project Overview

A multi-brand merchant group needed a unified way to connect their Shopify stores to internal ERP, CRM, and fulfillment systems. Orders, inventory, and customer data lived in silos; manual CSV exports and ad-hoc scripts led to sync failures and delayed fulfillment. The goal was to design and build custom Shopify apps and integrations that would keep commerce data flowing reliably and in real time.

Timeline: 4 months (discovery through launch and iteration). Role: Lead developer — architecture, API design, app build (Node.js), Liquid theme extensions, and webhook pipelines. Tech stack: Shopify Partner API, Polaris (React) for embedded app UIs, GraphQL Admin API, REST Admin API, webhooks (orders, products, customers), Node.js backend, PostgreSQL for app data, and serverless workers for event processing.

The Challenge

Integration complexity came from several directions. Data was fragmented: orders in Shopify, inventory in the ERP, customer history in a separate CRM. Manual workflows — downloading reports and re-uploading elsewhere — were error-prone and didn’t scale. Third-party sync tools often failed under load or didn’t support custom logic (e.g. splitting orders by warehouse, applying business rules before pushing to the ERP). We needed a solution that could handle high order volume, respect rate limits, and give the merchant full control over what got synced and where.

Flow 1 — Custom App Architecture

How the custom app sits between the merchant’s Shopify Admin and external systems.

Custom App Architecture Flow
Merchant Store Shopify Admin Custom App
Node.js
Shopify GraphQL API
Webhooks Event Queue Database
Third-party Services
ERP CRM Inventory Email

Flow 2 — Order Sync & Webhook Event Flow

From order placement to ERP sync and customer notification.

Order Sync & Webhook Flow
Order Placed order/create Webhook App Server
Validate & Parse Payload
Sync to ERP Log to DB
Trigger Fulfillment Notify Customer

Flow 3 — Merchant Onboarding Flow

From app install to dashboard-ready state.

Merchant Onboarding Flow
Install App OAuth Handshake Permission Grant
Fetch Store Config
Setup Webhooks Sync Products Dashboard Ready

Solution Walkthrough

Stage 1

Partner app & OAuth

Registered the app in Shopify Partners, configured OAuth scopes (orders, products, customers, read/write), and implemented the install callback to store the merchant’s access token and shop domain securely.

Stage 2

Embedded app (Polaris)

Built the merchant-facing UI as an embedded app using Polaris so it felt native inside Shopify Admin. Included settings for webhook selection, API keys for ERP/CRM, and a simple dashboard for sync status.

Stage 3

Webhook ingestion & queue

Incoming webhooks (order/create, order/updated, product/create, etc.) were validated, parsed, and pushed to an event queue. Workers consumed the queue and applied idempotency and retries to avoid duplicates and handle transient failures.

Stage 4

Billing API & metafields

Used the Shopify Billing API for one-time and recurring charges where the app added paid value. Stored app-specific config in metafields so settings survived theme changes and could be read from Liquid when needed.

Stage 5

Theme extensions

Added a small theme app extension so merchants could surface app-driven content (e.g. delivery estimates, custom fields) on the storefront without editing Liquid by hand.

Example: Webhook payload handling

// Validate HMAC, parse body, push to queue
app.post('/webhooks/orders/create', (req, res) => {
  if (!verifyShopifyHmac(req)) return res.status(401).send('Invalid');
  const payload = req.body;
  eventQueue.push({ topic: 'orders/create', shop: req.headers['x-shopify-shop-domain'], payload });
  res.status(200).send('OK');
});

Results & Impact

Before
  • Manual CSV exports and re-uploads between Shopify and ERP
  • Frequent sync failures and delayed fulfillment
  • No single view of order and inventory status
  • Custom business rules applied in spreadsheets
After
  • Real-time order and inventory sync via webhooks and GraphQL
  • 99.9% uptime on webhook delivery with retries and dead-letter handling
  • Checkout and fulfillment workflows ~3× faster due to automation
  • Embedded app gives merchants control without leaving Shopify Admin

"The custom app and integrations gave us one source of truth. We no longer chase orders across systems — everything flows automatically."

— Merchant operations lead (client)

Lessons Learned

Building commerce integrations or custom Shopify apps? Let's connect.

Get in Touch