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

# Introducción

> Crea plantillas de tienda personalizadas con la biblioteca cliente de Komerza

## ¿Qué es el desarrollo de tiendas?

Komerza te permite crear tiendas completamente personalizadas usando cualquier tecnología web que prefieras. Crea tu tienda con HTML, CSS y JavaScript—o usa frameworks como React, Vue o Svelte—y alójalo directamente en la infraestructura de Komerza.

Tu tienda importa la **Biblioteca Cliente de Komerza**, un script ligero que maneja todas las funcionalidades de e-commerce:

* **Tienda y Productos** - Obtén información de la tienda, productos, variantes y reseñas
* **Carrito** - Gestiona el estado del carrito, cantidades y selecciones
* **Pago** - Crea pedidos y redirige a páginas de pago alojadas
* **Análisis** - Seguimiento automático de visitas y conversiones (sin código)

## ¿Por qué construir en Komerza?

<CardGroup cols={2}>
  <Card title="Libertad de diseño completa" icon="palette">
    Sin plantillas ni temas con los que luchar. Controlas cada píxel.
  </Card>

  <Card title="Sin backend requerido" icon="code">
    La biblioteca cliente maneja toda la comunicación con la API. Solo HTML, CSS
    y JS.
  </Card>

  <Card title="Alojamiento instantáneo" icon="rocket">
    Despliega en la infraestructura de Komerza o lista en el mercado de temas.
  </Card>

  <Card title="Rendimiento rápido" icon="bolt">
    Los archivos estáticos cargan instantáneamente con entrega CDN global.
  </Card>

  <Card title="Protección DDoS de nivel empresarial" icon="shield-halved">
    Tu tienda permanece en línea bajo cualquier carga. Construido sobre
    Cloudflare para una resiliencia incomparable.
  </Card>

  <Card title="Copias de seguridad automáticas" icon="clock-rotate-left">
    Cada cambio y despliegue se respalda automáticamente. Almacena hasta 20
    copias en planes seleccionados.
  </Card>
</CardGroup>

## Ejemplo rápido

```html theme={null}
<!DOCTYPE html>
<html>
  <head>
    <title>Mi Tienda</title>
    <script src="https://cdn.komerza.com/komerza.min.js"></script>
  </head>
  <body>
    <h1 id="store-name"></h1>
    <div id="products"></div>

    <script>
      komerza.init('tu-id-de-tienda');

      komerza.getStore().then(response => {
        if (!response.success) return;

        const store = response.data;
        document.getElementById('store-name').textContent = store.name;

        store.products.forEach(product => {
          const variant = product.variants[0];
          document.getElementById('products').innerHTML += \`
            <div class="product">
              <h2>\${product.name}</h2>
              <p>\${variant.cost}</p>
              <button onclick="komerza.addToBasket('\${product.id}', '\${variant.id}')">
                Añadir al carrito
              </button>
            </div>
          \`;
        });
      });
    </script>
  </body>
</html>
```

## Mercado de temas

Crea tiendas que otros comerciantes de Komerza puedan usar. Tus plantillas pueden ser:

* Listadas en el mercado de temas para otras tiendas
* Personalizadas con opciones de configuración
* Desplegadas instantáneamente por los comerciantes
* Monetizadas a través del mercado

## Biblioteca cliente vs Referencia API

|                 | Biblioteca cliente       | Referencia API          |
| --------------- | ------------------------ | ----------------------- |
| **Para**        | Tiendas para clientes    | Gestión de la tienda    |
| **Auth**        | Pública (ID de tienda)   | Privada (claves API)    |
| **Ejecuta**     | Lado cliente (navegador) | Lado servidor           |
| **Operaciones** | Navegar, carrito, pago   | CRUD completo, análisis |
