> ## Documentation Index
> Fetch the complete documentation index at: https://docs.headkit.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Quickstart

> Spin up your headless store in minutes

<img className="rounded-md hidden dark:block" src="https://mintcdn.com/headkit/JQ7PihaagGA4z0TB/images/HeadKit_Docs_Onboarding-Dark.svg?fit=max&auto=format&n=JQ7PihaagGA4z0TB&q=85&s=30a22585fb8d33737c8d8c2caa446395" alt="HeadKit Commerce Quickstart" lightAlt="HeadKit Commerce Quickstart" darkAlt="HeadKit Commerce Quickstart" width="1920" height="1080" data-path="images/HeadKit_Docs_Onboarding-Dark.svg" />

<img className="rounded-md block dark:hidden" src="https://mintcdn.com/headkit/JQ7PihaagGA4z0TB/images/HeadKit_Docs_Onboarding-Light.svg?fit=max&auto=format&n=JQ7PihaagGA4z0TB&q=85&s=148b5dcd6ffcf60b6adba9136af14110" alt="HeadKit Commerce Quickstart" lightAlt="HeadKit Commerce Quickstart" darkAlt="HeadKit Commerce Quickstart" width="1920" height="1080" data-path="images/HeadKit_Docs_Onboarding-Light.svg" />

## Create your Store

Getting started is quick and easy. First you will be prompted to create your new store.

* Enter your Store Name.
* Confirm or change your Store URL. This is your preview subdomain, you can add a custom domain later.

## Configure your Store

Follow the steps to hook up vital connections to HeadKit Commerce. We’ll spin up your headless store within minutes.

<Steps>
  <Step title="Connect Repository" stepNumber={1} titleSize="h3">
    Select a Git provider to create your code repo.

    <AccordionGroup>
      <Accordion title="GitHub" defaultOpen icon="github">
        Authorise the HeadKit GitHub app to connect to a new or existing GitHub account. This will add the HeadKit Storefront codebase to your own repository and you will see the link to access the repo instantly. Our GitHub app automatically deploys your changes to your  store, so you don't need to manage deployments yourself.
      </Accordion>
    </AccordionGroup>

    *More Git providers coming soon.*

    The HeadKit Storefront codebase is cloned to your own repository, so you are free to make changes and extend your store as you wish. Create a beautiful design-led UI for a custom, on-brand user experience.

    Commit and push your changes to Git for your changes to update in your store. If you push and don't see that the changes are successfully deployed, you can also trigger a [deployment](/connections/framework).
  </Step>

  <Step title="Connect Commerce" stepNumber={2} titleSize="h3">
    Select your commerce integration from available connections. This connection will power your product catalogue, inventory and orders in the native experience of that platform.

    <AccordionGroup>
      <Accordion title="WooCommerce" defaultOpen icon="https://mintcdn.com/headkit/53zOtu53ciiSFXlm/images/icons/HeadKit_Integration_WooCommerce.svg?fit=max&auto=format&n=53zOtu53ciiSFXlm&q=85&s=9bf1a5ca73b29aefec7107c666cdd99b" width="70" height="18" data-path="images/icons/HeadKit_Integration_WooCommerce.svg">
        Choose to create a new site or connect an existing site

        **New**

        We'll create a new WooCommerce install on HeadKit Commerce Cloud. The install will take around 2 mins and be preconfigured ready to go. You will be provided the link to the WooCommerce admin, along with an email to reset your password for access. 

        **Existing**

        You’ll need to follow some steps before we can connect WooCommerce to HeadKit

        * make a backup of your WooCommerce site
        * download and install the HeadKit WooCommerce theme and required plugins
        * set permalink structure
        * create and assign menus

        Once these steps have been completed, connect you can proceed to connecting WooCommerce with HeadKit.

        More detailed instructions [here](/connections/commerce)

        *Tip: For existing stores, we recommend using a duplicate version to avoid disruption to your live site.* 
      </Accordion>
    </AccordionGroup>

    Learn more about [commerce](/connections/commerce) connections

    *More commerce providers coming soon.*
  </Step>

  <Step title="Connect Payments" stepNumber={3} titleSize="h3">
    Connect a payment integration to accept payments seamlessly through your HeadKit custom checkout.

    <AccordionGroup>
      <Accordion title="Stripe" defaultOpen icon="https://mintcdn.com/headkit/LbyeY6wQS5jDFJey/images/icons/HeadKit_Integration_Stripe.svg?fit=max&auto=format&n=LbyeY6wQS5jDFJey&q=85&s=cbd5482c0f51466cbdc27d0c29c9bdd2" width="70" height="30" data-path="images/icons/HeadKit_Integration_Stripe.svg">
        Connect or create your Stripe account. Follow the Stripe onboarding to complete your business details. Stripe is already integrated with your store and settings can be managed through your connected dashboard.
      </Accordion>
    </AccordionGroup>

    Learn more about [payments](/connections/payments)
  </Step>
</Steps>

That's it! You're all setup and ready with a headless store running on HeadKit.

## Next Steps

Because it was so quick and easy to go headless, you can now spend your time on making the store yours and creating an awesome user experience.

<Card title="Customise Branding" icon="swatchbook" horizontal href="/customisation/branding" cta="Customise Branding">
  Add your logo, icon, colours and custom domain to quickly make your store your own.
</Card>
