How to start building with new customer accounts in Shopify
Tags: shopify, beginners, tutorial, graphql
Published: 2024-06-11 18:52:35


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4nch2ncpt1m3zarjw4qv.png)

Shopify recently announced that new customer accounts are being made accessible to developers through the use of customer account UI extensions, which are now in developer preview. This means that Shopify developers can start building apps directly into the customer accounts portal. 

But what are they, why should app developers use them, and what can you build with them? We’re here to cover all the details.

## What are new customer accounts?

Shopify first launched new customer accounts in January 2023. Like classic customer accounts, they give the customer a way to check in on the status of their orders, subscriptions, addresses, and profile information. 

New customer accounts, however, will allow shoppers to sign in with either a one-time code, or through the Shop app. Merchants can even embed links in emails that give customers access to the order index page, order status page, and profile page without requiring any sign-in. 

From there, customers can update their customer profile, and the changes will be reflected in the Shopify admin, something that was not available in classic customer accounts. If you want a full breakdown of the differences, Shopify has a handy [comparison chart in their documentation](https://help.shopify.com/en/manual/customers/customer-accounts?shpxid=5a019658-2E33-4E6E-16C2-0BE7C22721EA).

## So why should developers care?

Back in December, Shopify announced that new customer accounts would be made available to app developers through customer account UI extensions. Much like checkout UI extensions, these will be a series of building blocks that merchants can use to enhance and customize their customer accounts pages. 

This opens up a whole new world of opportunities for how developers can help merchants create a better experience for their customers.

If you need help getting started, you can identify whether a merchant is using classic or new customer accounts [by querying](https://shopify.dev/docs/api/admin-graphql/2023-10/objects/CustomerAccountsV2#field-customeraccountsv2-customeraccountsversion) `customerAccountsVersion` using the GraphQL Admin API.

## What can you actually build?

The new customer account UI extensions will be available on the Order Status, Order Index, and Profile pages, as well as in the form of full-page extensions. The Shopify team expects to see a new wave of apps for order tracking, returns, subscriptions, loyalty programs, reviews, and more. 

[B2B extensions](https://shopify.dev/docs/apps/build/b2b) are one of the biggest areas of opportunity for developers looking to build with the new extensions type, since B2B functionality is exclusively supported on new customer accounts. B2B customers are [required to use new customer accounts](https://help.shopify.com/en/manual/b2b/considerations#b2b-customer-requirements), which means they’ll be spending a lot of time there. Extensions for things like customer-specific catalogs or payment terms would be a great place to start, and [Shopify might be keeping an eye out](https://x.com/pmillegan/status/1732062891011199399) for developers building these, but keep in mind B2B functionality is currently only for Shopify Plus merchants. 

[Inline extensions](https://shopify.dev/docs/apps/build/customer-accounts/inline-extensions/build-order-status?extension=react) can be added to either the Order Status or Profile page, with pre-determined placements throughout the page. These are great for things like the number of loyalty points a customer earned for a specific order, or encouraging customers to leave reviews of their recent purchases.

[Order actions menu extensions](https://shopify.dev/docs/apps/build/customer-accounts/order-action-extensions) are buttons that can be added to the Order Status and Order Index pages to allow customers to take action on their orders. Things like re-ordering, or reporting a problem with their order are great examples. Buttons can even link to a modal, to prompt the customer to confirm the action, and bring up any additional information that may be needed to complete an order action.

[Full-page extensions](https://shopify.dev/docs/apps/build/customer-accounts/full-page-extensions) allow developers to create unique pages within the customer account experience that will match all of the merchant’s branding, while delivering entirely custom content. Things like wishlists and subscriptions are great examples, and customers will be able to access these full-page extensions without leaving their account or needing to log in again.

## How to start building 

The Shopify CLI is currently the only way to generate extensions. If you're interested in building with customer account UI extensions, you should also make sure to consider some additional privacy and security measures. You can also follow our app tutorial to see how to build safe, secure customer account UI extensions.

Just like other extension types, customer account UI extensions are deployed to and hosted on Shopify's infrastructure. This means you don't need to worry about managing any additional services to add them to your apps. 

However, this also means that an app is a requirement, as merchants will need to a way to install them. If you're looking to distribute any extensions you build at scale, they'll need to be published to the app store.

## Out with the old?

As of June 2024, there’s no official deprecation date for classic customer accounts. Shopify will continue to support them for the time being. And they still have features that new customer accounts do not; things like [multipass](https://shopify.dev/docs/api/multipass) and liquid customizations.

Since new customer accounts are well, new, it’s likely Shopify will continue to add extensibility options as they roll out the feature. For now though, there’s plenty to work with, and early adopters might even have the [chance to be featured by Shopify](https://x.com/pmillegan/status/1732062599527997544) in a co-marketing campaign when customer account UI extensions become available to merchants.

We'll be sharing some detailed guides and tutorials on how to create and deploy your customer account UI extensions, so keep an eye out!

If you want to connect with other developers building with the new extensibility options, you can join the conversation [over on our Discord server](https://discord.com/invite/tY4ZjWdMcB).

Watch how we build our own customer account UI extension.

{% embed https://www.youtube.com/watch?v=sF6LRbWXOpg %}