Shopify Powers over a million online stores worldwide.
Many of the store features you see every day, such as discounts, bundles and order fulfillment, are built using apps. These apps are created by developers to enhance Shopify and solve real problems for merchants.
If you know JavaScript and basic web development, you already have enough skills to start building Shopify apps.
In this tutorial, you’ll learn what a Shopify app is, how Shopify apps work, and how to set up your development environment. You’ll also see three real examples of popular Shopify apps and how to build them.
What we will cover
To follow this tutorial, you should be comfortable with JavaScript and APIs. Some experience with Node.js and NPM would help, but you don’t need to be an expert. No prior experience with Shopify is required.
What is the Shopify app?
a Shopify app is a web application that connects to the Shopify store. The app runs on your own server or serverless platform.
It deals with the use of Shopify Secure APIs. When a merchant installs your app, they allow it to access some of the store’s data. This may include products, orders, or users depending on the permissions granted.
There are different types of Shopify apps.
Public apps are listed on the Shopify app store and can be installed by any merchant. These apps must pass a review before approval.
Custom apps are created for a single store, and private apps are used only within a company.
Most Shopify apps include back-end code that calls Shopify APIs, a front-end interface displayed within the Shopify admin, storefront features that shoppers can view, and webhooks that react to store events.
How Shopify Apps Work
When a merchant installs your app, Shopify gets started oauth process. This is a safe way to ask the merchant for permission.
Once approved, Shopify sends an access token to your app. This token allows your app to make API calls to the store.
Shopify Apps can add screens within the admin area App Bridge And Polaris. These tools make your app feel like part of Shopify. Apps can also add features to the Storefront using Theme App Extensions.
Shopify provides both Rest and GraphQL APIs. The rest are easier to use, but GraphQL is faster and more efficient. Today, most new apps use GraphQL.
Setting up your development environment
Before you start coding, you’ll need some tools. You will need to install node.js and Shopify CLI. You need one too Shopify Partner Account. A partner account lets you build apps and test them at no cost.
The Shopify CLI helps you quickly create a starter app. You can generate a working app by running these commands:
shopify app create node
cd my-shopify-app
npm install
shopify app serve
This creates an app with login, authentication, and an embedded admin interface. It also sets up a secure tunnel so that Shopify can reach your local server during your development.
Understanding Shopify APIs
Shopify provides APIs for almost every part of a store. This includes products, orders, customers and shipping. Your app can only access data that the merchant has authorized during installation.
Here’s a simple example of fetching products using the GraphQL Admin API:
import fetch from "node-fetch";
async function getProducts(shop, token) {
const query = `
{
products(first: 5) {
edges {
node {
id
title
}
}
}
}
`;
const response = await fetch(
`https://${shop}/admin/api/2025-10/graphql.json`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
"X-Shopify-Access-Token": token
},
body: JSON.stringify({ query })
}
);
const data = await response.json();
return data.data.products.edges;
}
This function gets the first five products from the store. The access token comes from the OAUTH process during app installation.
Case Study One: Bundle and Discount Apps
Bundle and discount apps help merchants offer deals like “buy two, get ten percent off.” These apps must work with Shopify’s pricing rules and checkout system. A famous example is Bundle Deals Appwhich displays offers on the product and cart pages.
These apps typically add small UI elements to the storefront using theme app extensions. They use Shopify’s discount APIs to securely apply offers.
They do not directly replace the checkout. Instead, they expand the storefront and let Shopify set the final prices.
A storefront script might look like this:
fetch("/apps/bundle-deals/api/bundles?productId=gid://shopify/Product/123")
.then((res) => res.json())
.then((bundles) => {
displayBundles(bundles);
});
This code runs in the frontend of the store. It fetches bundle rules from your app server and displays them to buyers.
Case Study Two: Printing and Order Fulfillment
Printed is a popular app that connects Shopify stores with a print-on-demand service (eg, t-shirts, mugs, and so on). When a customer places an order, Printful receives the order and starts production.
Such apps need access to commands and reliable event handling. They use webhooks to listen for new commands. When Shopify sends a webhook, the app sends the data to the external system.
Here is a simple webhook example:
app.post("/webhooks/orders/create", async (req, res) => {
const order = req.body;
await printfulClient.createOrder({
external_id: order.id,
items: order.line_items.map(item => ({
variant_id: item.variant_id,
quantity: item.quantity
}))
});
res.status(200).send("Order processed");
});
This keeps Shopify and Printful in sync. The same pattern is used for shipping tools, accounting software, and CRMs.
Case Study Three: Shiprockets and Shipping Rates
Shiprocket Helps merchants manage shipping and delivery. Shipping apps often calculate rates and update order status in real time after shipment.
Because Shopify restricts what can run during checkout, shipping apps typically calculate rates before checkout begins or by using carrier service APIs. A simple rate endpoint might look like this:
app.post("/shipping/rates", async (req, res) => {
const { destination, items } = req.body;
const rates = await fetchCarrierRates(destination, items);
res.json({
rates: rates.map(rate => ({
service_name: rate.name,
total_price: rate.price
}))
});
});
This allows merchants to show shipping options to customers before they reach checkout.
Testing your Shopify app
Testing is an important part of building a reliable Shopify app, especially if you plan to offer it in the App Store. Each feature should be thoroughly tested in the development store before one is considered for release. A development store lets you simulate real merchant behavior without affecting live data, making it ideal for both manual and automated testing.
In addition to live testing, Shopify allows you to: Joke API Answers during development. Mocking lets you test your business logic without relying on real API calls or rate limits. This is especially useful when simulating error scenarios or incomplete data, such as missing fields or unexpected values.
By combining real store testing with mock responses, you can be sure that your app behaves correctly in both normal and failure situations.
Preparation of the Shopify App Store
Preparing for the Shopify App Store is an important step if you want to release a public app that merchants can trust and install with confidence. Shopify has one Regular review processand your app must meet both technical and policy requirements before it can be listed.
Your app should only request API permissions that are absolutely necessary for its core functionality. Asking for extra or irrelevant permissions is a common reason apps are rejected. Shopify expects you to clearly explain why each permission is needed and how the data will be used. This helps merchants feel secure when installing your app.
You must also include basic legal and support information. This includes a clear privacy policy explaining what data you collect and how you handle it, terms of service explaining the rules of use, and visible support contact such as an email address or help page.
Finally, Shopify looks closely at app quality. Your app should be stable, handle errors gracefully, and be tested in typical store scenarios. Clear messaging, predictable behavior, and transparent use of data will go a long way in approving the review process.
The result
Building your first Shopify app takes time, but it’s very achievable. Start with logins and API calls. Learn how to embed UI within Shopify. Explore real apps from the Shopify App Store. Each solves a different problem using a different design.
As you practice, the pieces will begin to fit together. Keep building, testing, and reading the documentation. Your first Shopify app could be the start of something big.