--- title: Setup Environment description: Set up Shopify, create a project, and run or deploy Vercel Shop. url: "https://shop-docs.labs.vercel.dev/docs/getting-started" docs_index: /llms.txt lastUpdated: 2026-10-13 type: guide --- > For an index of all documentation, see [/llms.txt](/llms.txt). Start with a new Shopify store using the Deploy button, or connect an existing store and run Vercel Shop locally. ## Deploy with a new Shopify store Vercel creates the repository, creates the store through the [Vercel Marketplace Shopify integration](https://vercel.com/marketplace/shopify), and sets the required environment variables for you. Deploy with Vercel 1. Click **Deploy**, create the Shopify store in the deploy screen, and finish the deployment. 2. In the Vercel dashboard, open the project and click **Connections** in the sidebar. 3. Open **Shopify** and claim the store you created. 4. In Shopify admin, create or import your products. 5. Publish the products to the **Vercel Storefronts** sales channel. 6. Redeploy the project from the Vercel dashboard. The first deployment runs before the store has products, so the homepage shows no products until you redeploy. To show later product, collection, and content changes without redeploying, set up [webhooks](/docs/anatomy/webhooks). ## Use an existing Shopify store ### Prerequisites - Node.js 24 - [pnpm](https://pnpm.io) 12 for installing dependencies and running scripts - A Shopify store ### 1. Configure Shopify store Install Shopify's [Headless sales channel](https://apps.shopify.com/headless). In your Shopify admin, under **Sales channels**, click **Headless**, create a storefront, and copy its **public access token**. Grant the required [Storefront API permissions](/docs/reference/storefront-api-permissions). For the full walkthrough, see [Setup Shopify](/docs/getting-started/shopify-setup). > **Stores from the Vercel Marketplace:** > > If you created your store through the [Vercel Marketplace Shopify > integration](https://vercel.com/marketplace/shopify), you have the **Vercel Storefronts** channel > instead of **Headless**. Manage the storefront and its access token there. ### 2. Create your project ```bash pnpm create next-app@latest my-store --example https://github.com/vercel/shop cd my-store ``` The project includes the Shop skills for your coding agent in `.agents/skills/`. See [Extending with Agents](/docs/getting-started/extending-with-agents). ### 3. Add your credentials Copy the example environment file: ```bash cp .env.example .env.local ``` Set the three required values in `.env.local`: ```bash NEXT_PUBLIC_SHOPIFY_STORE_DOMAIN="your-store.myshopify.com" NEXT_PUBLIC_SHOPIFY_STOREFRONT_ACCESS_TOKEN="your-storefront-access-token-here" NEXT_PUBLIC_SHOPIFY_SHOP_ID="123456789" ``` Find `NEXT_PUBLIC_SHOPIFY_STORE_DOMAIN` under [Settings → Domains](https://help.shopify.com/en/manual/domains) in Shopify admin. Use the public access token from your [Headless channel storefront](https://shopify.dev/docs/storefronts/headless/building-with-the-storefront-api/manage-headless-channels) for `NEXT_PUBLIC_SHOPIFY_STOREFRONT_ACCESS_TOKEN`. The shop ID is the number in your store's customer accounts URL, `https://shopify.com/123456789/account`. > **Customer login needs more setup:** > > Customer accounts require additional credentials and configuration. See > [Authentication](/docs/anatomy/authentication) before enabling sign-in. See [Environment Variables](/docs/reference/env-vars) for optional settings. ### 4. Run the storefront ```bash pnpm dev ``` Open [localhost:3000](http://localhost:3000) and confirm that your Shopify products appear. If no products appear, you may still need to publish products to the Headless channel. See [publishing products to your storefront](/docs/getting-started/shopify-setup#publish-products-to-your-storefront). > **Local HTTPS with Portless:** > > For local HTTPS, install [Portless](https://portless.sh) with `pnpm add -g portless`, then run > `pnpm dev:portless`. Use it to test secure cookies. Customer sign-in needs a public HTTPS tunnel; > see [Authentication](/docs/anatomy/authentication). ### 5. Deploy to Vercel When you're ready to deploy, commit and push your changes to your Git repository. Then import the project at [vercel.com/new](https://vercel.com/new), or use the CLI: ```bash pnpm add -g vercel vercel ``` Add the required [environment variables](/docs/reference/env-vars) to the Vercel project before your first production deploy. Stores created through the [Vercel Marketplace Shopify integration](https://vercel.com/marketplace/shopify) have their Shopify credentials configured for you. To refresh the storefront when you edit products, collections, or content in Shopify, set `SHOPIFY_WEBHOOK_SECRET` and configure [webhooks](/docs/anatomy/webhooks). ## Related links #### [Setup Shopify](/docs/getting-started/shopify-setup) Configure the Shopify apps and sales channel used by the storefront. #### [Extending with Agents](/docs/getting-started/extending-with-agents) Customize the storefront with coding agents and project skills. #### [Environment Variables](/docs/reference/env-vars) Configure authentication, the shopping assistant, and other optional features. --- For a semantic overview of all documentation, see [/sitemap.md](/sitemap.md) For an index of all available documentation, see [/llms.txt](/llms.txt) For agent-facing discovery, including API and MCP surfaces, see [/agents.md](/agents.md)