Skip to main content
The Shopify App JavaScript SDK provides a comprehensive set of packages for building Shopify apps across different frameworks and environments. These packages handle authentication, API calls, webhooks, session management, and more.

​
Core Packages

@shopify/shopify-api

Framework-agnostic core library for OAuth, APIs, and webhooks

@shopify/shopify-app-remix

Build Shopify apps with Remix framework

@shopify/shopify-app-express

Build Shopify apps with Express.js

@shopify/shopify-app-react-router

Build Shopify apps with React Router v7

​
Architecture

The Shopify App JavaScript SDK follows a layered architecture:
1

Core Layer (@shopify/shopify-api)

The foundation library that provides:
  • OAuth authentication flow
  • Admin API and Storefront API clients
  • Webhook handling and validation
  • Session management interfaces
  • Billing API integration
  • REST and GraphQL support
2

Framework Adapters

Framework-specific packages that wrap the core library:
  • Remix: @shopify/shopify-app-remix
  • Express: @shopify/shopify-app-express
  • React Router: @shopify/shopify-app-react-router
Each adapter provides framework-specific utilities while maintaining consistent APIs.
3

Session Storage

Pluggable session storage adapters for different databases:
  • PostgreSQL
  • MySQL
  • MongoDB
  • Redis
  • DynamoDB
  • Prisma
  • In-memory (development only)

​
Key Features

​
Authentication & Authorization

All packages support Shopify’s OAuth 2.0 authentication flow with automatic token management:
  • Authorization code flow
  • Token exchange (Remix & React Router)
  • Online and offline access tokens
  • Automatic token refresh
Built-in session handling with support for multiple storage backends:
  • Automatic session creation and validation
  • Scope verification
  • Token expiration handling
  • Online and offline session types

​
API Clients

import { shopifyApi } from "@shopify/shopify-api";

const shopify = shopifyApi({
  apiKey: process.env.SHOPIFY_API_KEY,
  apiSecretKey: process.env.SHOPIFY_API_SECRET,
  scopes: ["read_products", "write_products"],
  hostName: "myapp.example.com",
  apiVersion: "2024-01",
  isEmbeddedApp: true,
});

// Create GraphQL client
const client = new shopify.clients.Graphql({ session });
const response = await client.request(
  `query { shop { name } }`
);

​
Webhook Handling

All packages provide webhook validation and processing: 
// Webhook validation
const isValid = await shopify.webhooks.validate({
  rawBody: requestBody,
  rawRequest: request,
});

// Process webhook
if (isValid) {
  await shopify.webhooks.process({
    rawBody: requestBody,
    rawRequest: request,
  });
}

​
Choosing the Right Package

Recommended: @shopify/shopify-app-remixRemix provides the best developer experience with:
  • Modern React framework
  • Built-in routing and data loading
  • TypeScript support
  • Excellent performance
Alternatively, @shopify/shopify-app-react-router if you prefer React Router v7.

​
Installation

npm install @shopify/shopify-app-remix @shopify/shopify-app-session-storage-prisma

​
Version Requirements

All packages require Node.js 20.0.0 or higher
PackageCurrent VersionNode Requirement
@shopify/shopify-api12.3.0>= 20.0.0
@shopify/shopify-app-remix4.1.1>= 20.10.0
@shopify/shopify-app-express6.0.5>= 20.0.0
@shopify/shopify-app-react-router1.1.1>= 20.0.0

​
Next Steps

Core API Guide

Learn about the @shopify/shopify-api package

Remix Guide

Build apps with Remix

Express Guide

Build apps with Express

React Router Guide

Build apps with React Router

​
Resources

Build docs developers (and LLMs) love

Get started for freeTalk to us