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

# Introduction

> Build and publish Join Markt storefront themes.

# Storefront Themes

Join Markt storefronts are **custom themes** with a dual runtime:

| Runtime            | Stack                         | Builder               |
| ------------------ | ----------------------------- | --------------------- |
| **Vite** (default) | React + Tailwind + TypeScript | Visual Builder + Code |
| **Nunjucks**       | `.njk` + `settings.json`      | Code / ZIP import     |

Themes own presentation. Join Markt owns catalog, cart, checkout, delivery, and customer portal.

***

## Start here (theme developers)

Everything for themes lives in this **Themes** tab (sidebar groups below).

### 1. Start here

1. [**Build a Custom Theme**](/storefront/custom-themes) — end-to-end overview
2. [**Theme Builder**](/guides/theme-builder) — Visual Builder for sellers
3. [**Template Structure**](/storefront/template-structure) — files and folders

### 2. Pick a runtime

| Path               | Read                                                                                                                                          |
| ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------- |
| **Vite** (default) | [Vite Storefront](/storefront/vite)                                                                                                           |
| **Nunjucks**       | [Nunjucks Theme API](/storefront/nunjucks) → [Shortcodes & Tags](/storefront/shortcodes) → [Nunjucks Pitfalls](/storefront/nunjucks-pitfalls) |

### 3. Build storefront pages

1. [**Products & Catalog**](/storefront/products) — groups, prices, on-hold
2. [**Homepage & Sections**](/storefront/homepage) — products on `/`
3. [**Policy & Legal Pages**](/storefront/policy-pages) — privacy / terms / refunds
4. [**Embed Checkout**](/storefront/embed) — buy buttons on external sites

***

## Mental model (vs Shopify Liquid)

| Shopify Liquid        | Join Markt                                             |
| --------------------- | ------------------------------------------------------ |
| `.liquid` templates   | Vite React **or** Nunjucks `.njk`                      |
| `{{ product.title }}` | `{{ product.name }}` / React `product.name`            |
| `{% section %}`       | Visual sections (Vite) or `markt_component` (Nunjucks) |
| Theme App Extensions  | Public APIs + embed `data-markt-*`                     |

There is **no** Liquid parser. Do not copy Shopify tag names.

***

## Contracts themes must honor

* **Routes:** `/`, `/products`, `/product/:slug`, policies
* **Catalog:** public storefront payload / Nunjucks context — never dashboard session APIs
* **Checkout:** platform `/checkout/{orderId}` (or embed modal)
* **Assets:** published under `/markt-theme-assets/live/{revision}/…`
* **Preview:** real iframe URL + dist files — not flattened React HTML snapshots

***

## Publish flow

1. Edit in Visual Builder (Vite) or Code / ZIP (Nunjucks)
2. **Publish** builds artifacts
3. Live store serves the revisioned theme
4. Rollback = previous revision when available

***

## Next

* Vite: [Vite Design →](/storefront/vite-design)
* Nunjucks: [Nunjucks Design →](/storefront/nunjucks-design)
* Overview: [Build a Custom Theme →](/storefront/custom-themes)