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

# Instalando na sua aplicação Web

## Instalação

Em sua aplicação web é necessário instalar o nosso SDK Web para que todo o fluxo seja traqueado e atribuído corretamente, para isso é necessário incluir o script do píxel da Nemu no `<head>` de todas as suas páginas Web, o píxel da Nemu pode ser criado em seu dashboard acessando: Integrações -> Píxels -> Clique aqui para adicionar

Veja novamente como instalar [aqui](/pages/onboarding/instalacao-pixel-nemu)

Ao fim da criação será exibido a URL do script do píxel da Nemu, copie e cole na `<head>` de todas as páginas de seu site

Com isso estará disponível a variável global `trackingNemu` com métodos utilitários para realizar o traqueamento

## Registrar UID a sessão do usuário

<Info>
  Para total segurança e integridade dos dados de usuários de sua aplicação,
  todos os UID registrados pelo nosso SDK são criptografados antes de serem
  armazenados em nossos servidores
</Info>

Durante o processo de login da aplicação adicione uma chamada ao método `setUserId()` passando como argumento o UID definido do usuário que acabou de realizar o processo de login, exemplo:

```js theme={null}
function autenticarUsuario() {
  const email = "usuario@example.com";
  const senha = "1234";

  loginUser({
    email: email,
    password: senha,
    onSuccess: function (userId) {
      trackingNemu.setUserId(userId);
      console.log(`NemuTracking: Registered user: ${userId}`);
    },
    onError: function () {
      console.error("NemuTracking: Failed to authenticate user");
    },
  });
}
```

É obrigatório garantir que usuários que já estavam logados antes da instalação ou atualização do SDK também sejam corretamente traqueados.

Para isso, você pode definir o UID assim que ele estiver disponível na aplicação normalmente logo após o carregamento do usuário salvo localmente.

Opções comuns em aplicações web seriam:

**App SPA**: dentro do `useEffect` de carregamento global **Sites comuns**: logo após o script da SDK carregar, se `window.user` já estiver disponível

```js theme={null}
const userId = window.sessionUser?.email || window.sessionUser?.id;

if (userId) {
  nemuTracking.setUserId(userId);
}
```

## Recuperar UTMs ao enviar disparo de venda para a API da Nemu

O método `getLastSessionHistory()` retorna um objeto contendo as UTMs da última sessão do usuário, utilize esse objeto ao enviar as informações da venda a API da Nemu

```js theme={null}
function enviarVendaComUtms() {
  const session = trackingNemu.getLastSessionHistory();

  if (!session) {
    console.log("No sessions found");
    return;
  }

  const payload = {
    transactionId: "123",
    netValue: 10,
    status: "paid",
    utm_campaign: session.utmCampaign ?? null,
    utm_content: session.utmContent ?? null,
    utm_medium: session.utmMedium ?? null,
    utm_source: session.utmSource ?? null,
    utm_term: session.utmTerm ?? null,
  };

  const url = "https://developers.nemu.com.br/api/v1";

  fetch(url, {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify(payload),
  })
    .then((response) => {
      console.log(`API response: ${response.status}`);
    })
    .catch((error) => {
      console.error(`Error to send: ${error.message}`);
    });
}
```
