Vibe Code a Crypto Checkout: Build a Shopify Store with AI in 30 Minutes

In February 2025, Andrej Karpathy posted a tweet that changed how developers think about writing software. He called it “vibe coding,” the practice of describing what you want to an AI, accepting the generated code, and never looking back. One year later, the term has evolved into an entire movement. Karpathy himself now prefers “agentic engineering,” but the core idea persists: you orchestrate, the machine writes. What happens when you apply that philosophy to something merchants actually need, like a crypto checkout on Shopify? You get a working store in 30 minutes, and this guide walks you through it.

What Is Vibe Coding?

Vibe coding is a software development approach where you describe your intent to a large language model and let it generate the code. You do not write functions line by line. You do not debug syntax errors manually. You provide context, review the output, and iterate on the result. The term was coined by Andrej Karpathy in a February 2025 tweet, where he described “fully giving in to the vibes” while using Cursor Composer with Claude.

By early 2026, vibe coding has gone from a Silicon Valley meme to a recognized development paradigm. Google Cloud, IBM, and Red Hat have all published guides on the practice. Karpathy himself has moved on to the term “agentic engineering,” emphasizing that modern developers spend most of their time orchestrating AI agents rather than writing code directly. But for the purpose of this tutorial, the original concept applies: you will describe what you want, and your AI coding assistant will build it.

The tool we use here is Claude Code, Anthropic’s terminal-based coding agent. It reads your entire project, makes multi-file edits, and handles Git operations. If you have used Cursor or GitHub Copilot, think of Claude Code as the version that lives in your terminal and understands your full repo context through CLAUDE.md configuration files.

Prerequisites

Before you start, make sure you have the following ready:

• Claude Code installed. Run npm install -g @anthropic-ai/claude-code in your terminal. You need Node.js 18+ and an Anthropic API key. Cursor or Windsurf work too, but this tutorial uses Claude Code commands.
• A Shopify Partner account. Sign up at partners.shopify.com if you do not have one. You will create a development store for testing.
• An Aurpay merchant account. Register at aurpay.net to get your API credentials. Aurpay provides the crypto payment gateway that connects to Shopify via its official app.
• Shopify CLI. Install it with npm install -g @shopify/cli. You will use it alongside Claude Code to preview and deploy your theme.
• Basic terminal comfort. You do not need to know Liquid templating or JavaScript. That is the point. But you should know how to navigate directories and run commands.

Step 1 — Scaffold Your Store Theme

Open your terminal, create a project directory, and initialize a Shopify theme using Claude Code. The key here is writing a clear prompt that specifies your store’s purpose.

mkdir crypto-store && cd crypto-store
claude

Once Claude Code launches, give it your first prompt:

Create a Shopify theme using Dawn as the base. The store sells digital products
and physical crypto hardware (cold wallets, signing devices). Use a minimal dark
theme with accent color #6C5CE7. Set up the directory structure following Shopify
OS 2.0 conventions with sections, templates, and snippets directories.

Claude Code will scaffold the full directory tree: layout/, sections/, templates/, snippets/, assets/, and config/. It reads the Dawn theme structure and generates customized versions of theme.liquid, header.liquid, and footer.liquid with your branding applied.

Review the output. If the color scheme is wrong or a section is missing, describe the fix conversationally:

Change the header background to solid #1a1a2e and make the navigation links
white. Add a sticky header that collapses on scroll.

This is vibe coding in practice. You are not editing CSS files. You are telling the agent what the result should look like, and it modifies the Liquid templates and stylesheet accordingly. If you want to understand how AI agents interact with payment APIs at a deeper level, read What Is MCP? AI Agents and Payment APIs for the architectural context. You can also build your own crypto payment MCP server to give Claude direct access to payment operations.

Preview your theme locally:

shopify theme dev --store your-dev-store.myshopify.com

Step 2 — Add Product Pages

With the theme scaffold in place, you need product page templates. Ask Claude Code to generate them with structured data baked in — this matters for SEO.

Create a product template at templates/product.json that includes these sections:
1. Product hero with image gallery (swipeable on mobile)
2. Price block showing both fiat and crypto price equivalent
3. Product description with collapsible FAQ accordion
4. Related products carousel

Add JSON-LD structured data (Product schema) to the template that includes
name, description, price, currency, availability, and brand. Use the product
metafields for the data source.

Claude Code generates the template JSON file and the corresponding section Liquid files. The structured data snippet will look something like this:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": {{ product.title | json }},
  "description": {{ product.description | strip_html | truncate: 500 | json }},
  "image": {{ product.featured_image | image_url: width: 1200 | json }},
  "brand": {
    "@type": "Brand",
    "name": {{ product.vendor | json }}
  },
  "offers": {
    "@type": "Offer",
    "price": {{ product.price | money_without_currency | json }},
    "priceCurrency": "USD",
    "availability": "https://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}"
  }
}
</script>

Add a few test products through the Shopify admin or via CLI. Two or three products are enough to verify the template renders correctly. The dual-price display (fiat + crypto) is a visual signal to customers that your store accepts cryptocurrency — and it becomes functional once you wire up the Aurpay checkout in the next step.

Step 3 — Integrate Crypto Checkout with Aurpay

This is the core section. You have a themed store with product pages. Now you need to accept crypto payments. Aurpay’s Shopify app handles the payment processing, but you can use Claude Code to customize the checkout experience and add a crypto payment button to your storefront.

Install the Aurpay App

Go to the Shopify App Store and search for Aurpay, or install directly from Aurpay’s Shopify integration guide. The app connects your store to Aurpay’s payment gateway, which supports USDT, USDC, BTC, ETH, and other major tokens across multiple chains.

After installation, configure your settlement preferences in the Aurpay dashboard. Most merchants choose stablecoin settlement (USDC or USDT) to avoid price volatility, a strategy covered in depth across the crypto payments development tutorial series.

Add a Crypto Payment Badge

Shopify handles the actual checkout flow through its payments infrastructure. But adding a visible “We Accept Crypto” badge on product pages increases conversion by setting expectations before checkout. Ask Claude Code to create it:

Create a Shopify snippet called crypto-badge.liquid that displays a row of
cryptocurrency icons (BTC, ETH, USDT, USDC) with the text "We accept crypto
payments via Aurpay". Use inline SVG icons, no external dependencies. Style it
as a subtle banner below the Add to Cart button. Make it responsive.

Claude Code generates the snippet with inline SVGs for each token icon. Include it in your product template:

{% comment %} Add below the add-to-cart button {% endcomment %}
{% render 'crypto-badge' %}

Customize the Cart Page

For stores that use a cart page (rather than drawer cart), you can add a payment method summary that reminds customers about crypto options:

In the cart template, add a payment methods section below the checkout button.
Show icons for Visa, Mastercard, Apple Pay, and crypto (BTC, ETH, USDT).
Add a small text line: "Crypto payments powered by Aurpay — settle in
stablecoins with zero chargeback risk."

The Aurpay app handles the actual payment routing at checkout. When a customer selects crypto as their payment method, Aurpay generates a payment invoice with a QR code, tracks the on-chain transaction, and confirms the order once the payment reaches the required number of confirmations. Merchants receive funds in their chosen settlement currency. For businesses that also need automated crypto invoicing, the same AI-driven approach applies to invoice generation and settlement tracking.

Add Checkout Extensibility (Optional)

If you are on Shopify Plus, you can use Checkout UI Extensions to add a crypto discount banner directly in the checkout flow:

Create a Shopify checkout UI extension that displays a banner: "Pay with crypto
and save 2% — powered by Aurpay". Only show it when the cart total exceeds $50.
Use the checkout extensibility API.

Claude Code will scaffold the extension with the correct directory structure, including the shopify.extension.toml configuration and the React component for the banner. This approach works because crypto payments have lower processing fees than credit cards, and passing that saving to customers is a proven conversion tactic.

Step 4 — Test and Deploy

Before going live, test the full flow in Shopify’s development environment.

Theme Preview

# Start the local development server
shopify theme dev --store your-dev-store.myshopify.com

# Run theme check for Shopify best practices
shopify theme check

Walk through the customer journey: browse products, add to cart, proceed to checkout, and select the crypto payment option. Verify that the Aurpay payment flow triggers correctly and that order confirmation works end to end.

Aurpay Sandbox Testing

Aurpay provides a sandbox mode for testing. In your Aurpay dashboard, switch to test mode and use testnet tokens to simulate a purchase. Verify these checkpoints:

• Payment invoice generates with the correct amount and supported tokens
• QR code is scannable and links to the correct payment address
• Order status updates to “paid” after testnet confirmation
• Webhook fires correctly and Shopify marks the order as paid
• Settlement lands in your configured wallet address

Deploy to Production

Once testing passes, push your theme to production:

# Push theme to Shopify
shopify theme push --store your-production-store.myshopify.com

# Publish as the live theme
shopify theme publish

Switch Aurpay from sandbox to production mode. Your store is now live with crypto payments.

What You Built in 30 Minutes

Here is a summary of what you accomplished without writing code manually:

• A custom Shopify theme based on Dawn, with dark branding and responsive layouts, scaffolded by Claude Code from a text prompt.
• Product page templates with image galleries, dual-price display, FAQ accordions, and JSON-LD structured data for search engines.
• Crypto payment integration through Aurpay, supporting BTC, ETH, USDT, USDC, and other tokens with stablecoin settlement.
• Checkout customizations including crypto badges, payment method icons, and optional discount banners for crypto payers.
• A tested deployment verified through Shopify’s dev tools and Aurpay’s sandbox before going live.

The total time depends on how much you iterate on design details, but the functional scaffolding (theme, products, payment integration) takes about 30 minutes of prompt-driven development. This is vibe coding applied to real commerce infrastructure.

The pattern extends beyond Shopify. The same approach works for WooCommerce stores, headless commerce builds, and custom checkout flows. If you are building on WordPress, the WooCommerce crypto payments tutorial covers the equivalent workflow with Claude Code and Aurpay’s WooCommerce plugin.

Ready to Go Live?

Aurpay’s Shopify app adds crypto payment support with stablecoin settlement and multi-chain coverage. Whether you vibe-coded your entire theme or hand-crafted every pixel, adding crypto checkout takes less than five minutes.

Set up Aurpay on your Shopify store and start accepting crypto payments today. No code required. But if you want to customize, you now know how to let the AI handle it.