Skip to main content

Start building for checkout

To get started with checkout UI extensions, Shopify Functions or web pixel extensions, you can use Shopify CLI, which generates starter code for building your extension and automates common development tasks.

The following is a lightweight guide for getting started to build. You can alternatively learn how to use the GraphQL Admin API to style checkout for a brand, such as changing the colors and corner radius settings on checkout form fields.


Anchor to Language-specific requirements for writing Shopify Functions in RustLanguage-specific requirements for writing Shopify Functions in Rust


  1. Scaffold an app:

    Terminal

    shopify app init
  2. Navigate to your app directory:

    Terminal

    cd <directory>
  3. Run the following command to create a new extension:

    Terminal

    shopify app generate extension --name my-extension
  4. Choose from one of the following extension types:

    • Checkout UI
    • Function (any of the sub-types)
    • Post-purchase UI
    • Web Pixel
  5. Select a language for your extension.

    For this quickstart, if you chose a Function extension type, then select either Rust or JavaScript.

  6. Complete one of the following steps:

    • If you chose a Checkout UI, Post-purchase UI or Web Pixel extension type, then start your development server to build and preview your app:

      Terminal

      shopify app dev

      Press p to open the developer console. In the developer console page, click on the preview link for your extension.

    • If you chose a Function extension type, then navigate to extensions/my-extension and build the function's Wasm module:

      Terminal

      cd extensions/my-extension
      cargo build --target=wasm32-wasip1 --release

      To test your function, you need to make it available to your development store. Learn more.



Was this page helpful?