> 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/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/inicio-rapido.md).

# Quick start

## Prerequisites

Before you begin, make sure you have:

{% stepper %}
{% step %}

### Authentication Token

You'll need a **TOKEN** authentication token, provided by the Facephi team, to access the SDK.
{% endstep %}

{% step %}

### Node.js and package manager

Make sure you have **Node.js** and **NPM** (or your preferred package manager) installed on your system.

* [Official Node.js website](https://nodejs.org/es/) (recommended v20+)
* [NPM documentation](https://docs.npmjs.com/try-the-latest-stable-version-of-npm)
  {% endstep %}

{% step %}

### API Key

Generate your [first Integration](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/integraciones-no-code-low-code/integraciones-low-code.md) from the IDV Suite panel, once the Integration is created and published, an associated API Key will be generated.\
**This API Key will be provided by the Facephi Support team.**
{% endstep %}
{% endstepper %}

## Basic concepts

### SDK Loader

The SDK Loader is a lightweight package that dynamically loads the package `@facephi/sdk-web-wc` from the CDN at runtime. It automatically creates and configures the element `<facephi-sdk-provider>` in your application.

**Basic usage:**

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

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

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

{% endcode %}

### How it works

When you call `loadSdk()`:

{% stepper %}
{% step %}
The SDK Web Components package is loaded from the CDN.
{% endstep %}

{% step %}
Custom elements are registered in the browser.
{% endstep %}

{% step %}
An element is created `<facephi-sdk-provider>` with your configuration.
{% endstep %}

{% step %}
The provider is inserted into the container element you specified.
{% endstep %}
{% endstepper %}

## Next steps

Now that you know the basics, you can start integrating the SDK:

* [**Integration guide**](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/integracion.md): Step-by-step installation and Integration instructions
* [**SDK Configuration**](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/configuracion-del-sdk.md): Feature configuration options `loadSdk`
* [**Next.js integration**](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv/integrations/nextjs.md): Guide for Next.js applications
* [**Programming examples**](https://github.com/facephi/sdk-web-examples): Collection of example implementations

For a complete view of the documentation structure, see the [main index](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv.md).