> For the complete documentation index, see [llms.txt](https://docs.facephi.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.facephi.com/productos/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/inicio-rapido.md).

# Inicio rápido

## Requisitos previos

Antes de comenzar, asegúrate de tener:

{% stepper %}
{% step %}

### Token de autenticación

Necesitarás un **TOKEN** de autenticación, proporcionado por el equipo de Facephi, para acceder al SDK.
{% endstep %}

{% step %}

### Node.js y gestor de paquetes

Asegúrate de tener **Node.js** y **NPM** (o tu gestor de paquetes preferido) instalados en tu sistema.

* [Sitio oficial de Node.js](https://nodejs.org/es/) (recomendado v20+)
* [Documentación de NPM](https://docs.npmjs.com/try-the-latest-stable-version-of-npm)
  {% endstep %}

{% step %}

### Apikey

Genera tu [primera integración](/productos/idv-suite/flujos-and-integraciones/integraciones-no-code-low-code/integraciones-low-code.md) desde el panel de IDV Suite, una vez creada la integración y se publique, se generará un API Key asociado.\
**Este API Key será proporcionado por el equipo de Soporte de Facephi.**
{% endstep %}
{% endstepper %}

## Conceptos básicos

### SDK Loader

El SDK Loader es un paquete ligero que carga dinámicamente el paquete `@facephi/sdk-web-wc` desde la CDN en tiempo de ejecución. Crea y configura automáticamente el elemento `<facephi-sdk-provider>` en tu aplicación.

**Uso básico:**

{% code title="example.ts" %}

```typescript
import { loadSdk } from '@facephi/sdk-loader';

const sdkElement = await loadSdk({
  apiKey: 'YOUR_APIKEY',
  containerId: 'sdk-container',
});
```

{% endcode %}

### Cómo funciona

Cuando llamas a `loadSdk()`:

{% stepper %}
{% step %}
El paquete de Web Components del SDK se carga desde la CDN.
{% endstep %}

{% step %}
Los elementos personalizados se registran en el navegador.
{% endstep %}

{% step %}
Se crea un elemento `<facephi-sdk-provider>` con tu configuración.
{% endstep %}

{% step %}
El provider se inserta en el elemento contenedor que hayas especificado.
{% endstep %}
{% endstepper %}

## Siguientes pasos

Ahora que conoces los conceptos básicos, ya puedes empezar a integrar el SDK:

* [**Guía de integración**](/productos/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/integracion.md): Instrucciones paso a paso de instalación e integración
* [**Configuración del SDK**](/productos/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/configuracion-del-sdk.md): Opciones de configuración de la función `loadSdk`
* [**Integración con Next.js**](/productos/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/integrations/nextjs.md): Guía para aplicaciones Next.js
* [**Ejemplos de programación**](https://github.com/facephi/sdk-web-examples): Colección de implementaciones de ejemplo

Para una visión completa de la estructura de la documentación, consulta el [índice principal](/productos/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv.md).
