Building on Shopify shouldn't mean wrestling with APIs and writing boilerplate code. What if you had an expert assistant ready to help you learn, code, and ship faster?
Meet the Shopify Dev Assistant: powered by AI, trained on Shopify's official developer documentation, and integrates directly into your dev tools.
The Shopify Dev Assistant adapts to where you are in your workflow:
Learning on Shopify.dev: chat with the Dev Assistant directly within the Shopify developer docs for quick questions, understanding complex concepts, and getting high-level guidance on the best way to build.
Building in your IDE: connect via our Shopify Dev MCP server for context-aware coding assistance that understands your project files, provide personalized code, help debug issues, and generate solutions that are tailored to your specific app.
Let's dive into how this works in practice, starting with how the assistant can act as your personal guide on Shopify.dev.
The Learning Zone: Your AI Guide on Shopify.dev
Your journey often begins on Shopify.dev: when you’re reading the docs and a question pops into your head. The dev assistant is right there, ready to help. Located in the top navigation bar, it’s your go-to resource for exploring concepts and clarifying details without breaking your flow. Think of it as having a direct line to an expert who can help you:
Understand API Behavior: Instead of piecing together information from multiple guides, just ask. For example: "What’s the best way to paginate through orders using GraphQL?"
Navigate Complex Workflows: Get guidance on multi-step processes. For instance, you can walk through an entire development journey with prompts like:
- "I want to offer a free gift with every purchase over $100. What kind of Function should I use?"
- "Okay, how do I build a Cart Transform Function to do that?"
- "Now that I have the code, how do I activate this function on my store?”
From Answer to Action: Instant Code and Concepts
One of the most powerful features of the Dev Assistant on Shopify.dev is its ability to bridge the gap between learning and doing. When you ask for help, the assistant doesn't just provide an answer; it often generates ready-to-use code.
For the Admin API, it provides ready-to-run GraphQL operations. Every code block comes with a "Run in GraphiQL" button, allowing you to test the query or mutation directly from the chat UI. This creates a powerful feedback loop: ask a question, get code, and test it live in seconds. Ensure you have a Shopify app running locally to access this feature.
For Shopify Functions, the assistant provides a complete code scaffold. It gives you the boilerplate logic for your use case, saving you from having to look up the required input/output structures and letting you focus on the customization.
While the Dev Assistant on Shopify.dev is your perfect learning partner for generating these foundational blueprints, the real magic begins when you bring that intelligence into your code editor.
The Building Zone: Your AI Partner in the IDE
Using the Shopify Dev MCP server, you can connect the assistant to supported IDEs like Cursor. This is Shopify's recommended method for AI-assisted development because it unlocks the single most important capability: context-awareness.
Unlike a standard chatbot, the in-IDE assistant can reference your project's files. It understands your existing code, dependencies, and file structure. This transforms its ability to help you, allowing it to:
Generate Personalized Code:The assistant doesn't just give you a generic snippet. It provides code that matches your project's style and dependencies, making it faster to integrate.
Scaffold Directly in Your Editor: Prompt the assistant to create new Shopify Functions or Admin API calls, and it will generate the necessary files and logic right within your project directory.
Get Context-Aware Suggestions: Stuck on a bug? The assistant can analyze the relevant files and provide targeted suggestions for fixing the issue, acting as an instant second opinion.
Think of it as pair programming with an expert who has already memorized every page of Shopify's documentation and read your entire project.
Getting started is simple. You can install the Shopify Dev MCP Server by following the instructions in our developer documentation. Once connected, you’re ready to start building faster.
From Prompt to Product: The Assistant in Action
The best way to understand the power of the Shopify Dev Assistant is to see it in action. Let's walk through two of the most common and powerful use cases where the assistant can save you hours of time and effort: generating Admin API calls and scaffolding Shopify Functions.
While you can follow these examples in either the docs or an IDE, remember that the IDE provides the most personalized results by tailoring the code to your project's structure.
Mastering the Admin API: Generate GraphQL Operations Instantly
The Challenge: Writing GraphQL operations, especially complex ones, can be tedious. You need to remember the exact names of fields, how to structure filters, and the correct syntax for mutations. This often means constant back-and-forth between your editor and the API documentation, slowing you down.
The Assistant's Solution: Skip the manual work. Simply describe the data you need in plain English, and let the assistant write the query for you.
Imagine you need to update the product title for any new products added to your store with ‘NEW!’.
"I want to append ‘NEW!’ to the title of the most recently added product to my store”
The assistant instantly provides a perfectly formatted, ready-to-run query that handles the nested objects and pagination correctly. No documentation required.
Effortless Extensions: Scaffold Shopify Functions with a Single Prompt
The Challenge: Shopify Functions are incredibly powerful, but getting started can be intimidating. You first need to identify the right Function API for your use case, then understand its specific input/output structure, and finally write the boilerplate code in JavaScript or Rust before you can even get to your unique business logic.
The Assistant's Solution: The Dev Assistant acts as an expert project scaffolder. Describe the business logic you want to create, and it will generate a complete, working Function file with the correct structure and boilerplate.
Let's say you want to build a validation function that ensures Shoppers can only checkout if the order total is less than 500 USD.
You give the assistant the following prompt:
"Create a function to ensure shoppers can only checkout an order total that is less than 500 USD'”.
The assistant generates a complete function file. It includes the correct input structure, the logic to validate the order total in cart and block checkout if the value is greater than 500 USD. You just saved an hour of setup and can immediately focus on refining the logic.
From Idea to Interface: Build Polaris UIs in Minutes
The Challenge: A great user interface is critical for any successful app. Shopify's Polaris design system provides the components to build beautiful, native-feeling UIs, but building pages from scratch can be slow. You have to remember the names of dozens of components, their required props, and how to nest them correctly to create a clean, responsive layout.
The Assistant's Solution: The Dev Assistant acts as your personal UI expert. It knows the Polaris component library inside and out. Simply describe the interface you want to build, and it will generate complete, structured components for you.
Let's say you need to build an admin UI extension to capture product notes for each product on product details page.
You give the assistant the following prompt:
"Create a component for a settings page using Polaris. It should have a page title of 'Settings', a card containing a form with a text field for an 'API Key', and a primary 'Save' button at the bottom."
The assistant generates a complete .jsx file and arranges them in the correct JSX structure. You get a fully-formed functionality in seconds, letting you focus on the logic and functionality instead of the layout.
Master Your Theme: Generate & Validate Liquid Instantly
The Challenge: A unique, high-performing storefront is built on Liquid, Shopify’s powerful templating language. But customizing themes or building new ones from scratch can be a meticulous process. Developers need to master intricate syntax, remember which objects are available in different contexts, and write complex logic for loops and conditionals. A single misplaced bracket or incorrect object call can break a page, leading to frustrating debugging and lost time.
The Assistant's Solution: The Shopify.dev MCP server now acts as your expert theme developer. It has a deep understanding of Liquid's syntax, objects, filters, and best practices. It can generate entire theme sections from a simple description or validate your existing code to catch errors before they go live.
Let's say you want to add a custom product grid to your homepage to feature a new collection.
You give the assistant the following prompt:
"Create a Liquid snippet for a 4-column product grid. For each product, show its featured image, title, vendor, and price. If the product is on sale, display a 'Sale' badge and show the compare_at_price."
The assistant instantly generates a complete, well-structured Liquid snippet. It creates the for loop to iterate through the collection's products, correctly outputs the requested product properties ({{ product.title }}, {{ product.price | money }}), and even includes the if statement to check if the product is on sale.
You get a fully functional, error-free code block in seconds, allowing you to bypass the tedious manual coding and focus on what truly matters: creating a beautiful and effective customer experience.
Best Practices for Using the Shopify Dev Assistant
To get the most out of your new AI partner, it helps to think of it less like a search engine and more like a fellow developer. Clear, specific, and contextual instructions will always yield the best results. By improving your prompts, you'll improve the output.
Here are some best practices to follow:
Provide as Much Context as Possible
A great prompt helps the assistant understand your goal. Instead of just pasting an error message, explain what you're trying to achieve and what you've already tried.
Instead of: "This code doesn't work."
Try: "I'm trying to create a cart transform function to add a free gift, but I'm getting an error that the input format is wrong. Here is my code..."
Break Down Complex Problems
You'll get the best results by solving a big problem one piece at a time. If you want to build a multi-part feature, ask the assistant to build the core logic first. Once that's working, ask it to add the next layer of functionality.
For example, to build a configurable discount, start by asking: "Build a product discount function that applies a 10% discount to products with the 'sale' tag." After you verify it works, you can iterate with a follow-up: "Now, can you help me add a metafield setting so the merchant can configure that percentage?"
Ready to get started?
Install the Shopify Dev MCP Server to bring your AI pair programmer into your favorite IDE.
Or, start asking questions right away by clicking the "Assistant" button on any page in the Shopify developer docs.
Let us know in the community forums how you're using the Shopify Dev Assistant, what tips you've discovered, or if you have any questions on how to get the most from this tool. Happy building!
