> 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-pt-br/sdks/sdk-web/introduccion/primeros-pasos.md).

# Primeiros passos

## Definir o Componente

A biblioteca fornece um **loader** para definir o componente personalizado. Este deve ser chamado para que o navegador o interprete corretamente.

```js
import { defineCustomElements as defineFacephiSdkCustomComponent } from '@facephi/sdk-web-wc/loader';

// Asocia los elementos personalizados al objeto window
defineFacephiSdkCustomComponent(window);
```

Recomenda-se adicionar um alias para a definição do componente personalizado do SDK.

***

## Obter uma Licença

Para utilizar o SDK Web, solicite uma **licença** à equipe de suporte da Facephi. Uma vez obtida, use a **ApiKey** fornecida para configurar o SDK:

```jsx
<facephi-sdk-provider apikey={process.env.FACEPHI_SDK_APIKEY}>
  {/* Aquí se colocarán los widgets */}
</facephi-sdk-provider>
```

> Cada licença (ApiKey) tem associadas as credenciais necessárias para o uso interno dos diferentes componentes e funcionalidades, vinculadas ao domínio em que será usada.

***

## Como se usa?

O SDK Web segue o padrão de **Web Components**, utilizando um componente provedor chamado `<facephi-sdk-provider>`. Este provedor envolve toda a lógica do SDK e fornece a funcionalidade essencial necessária para que os widgets funcionem corretamente.

É **obrigatório** incluir o `<facephi-sdk-provider>` em sua aplicação. Sem ele, os widgets **não funcionarão corretamente**. Este provedor atua como a camada base para integrar o SDK em sua aplicação.

***

### Exemplo de Integração

Para começar, envolva o `<facephi-sdk-provider>` ao redor da sua aplicação ou dos widgets que deseja usar. A seguir, um exemplo de integração do widget **Selphid** dentro do provedor:

```jsx
import { Language, TypeFamily } from '@facephi/sdk-web-wc';

<facephi-sdk-provider
  apikey={process.env.FACEPHI_SDK_APIKEY}
  type={TypeFamily.onboarding}
  language={Language.en}
>
  <facephi-selphid-widget />
</facephi-sdk-provider>
```

Esta estrutura garante que o widget SelphID funcione corretamente com toda a funcionalidade necessária fornecida pelo provedor do SDK.

Todas as informações de configuração do Componente SDK Provider você poderá encontrar em [esta seção](/docs.facephi-pt-br/sdks/sdk-web/componentes/sdk-provider.md).

Para exemplos mais completos de integração, consulte a [página de exemplos de programação](/docs.facephi-pt-br/sdks/sdk-web/frameworks-y-samples.md).

***

## Próximos passos

* Configure os Componentes e módulos conforme suas necessidades.
* Explore os [Exemplos de integração](/docs.facephi-pt-br/produtos/landing/ejemplos-de-integracion.md).
* Revise as seções específicas de cada módulo, como [Selphi](/docs.facephi-pt-br/sdks/sdk-web/componentes/selphi-biometria-facial.md), [SelphID](/docs.facephi-pt-br/sdks/sdk-web/componentes/selphid-documentos.md) ou [Video Recording](/docs.facephi-pt-br/sdks/sdk-web/componentes/video-recording-video-grabacion.md).

<br>