Primeiros Passos

Instale o SDK no seu app e mostre o primeiro paywall em 5 minutos

TL;DR

Instale o pacote, envolva seu app com PaywalloProvider passando sua appKey, e chame Paywallo.presentPaywall() onde quiser exibir a tela de compra. Em menos de 10 minutos seu app já rastreia eventos e exibe paywalls remotos.

Pré-requisitos

Antes de começar, verifique que você possui:

  • Paywallo SDK instalado — veja a seção de instalação abaixo
  • npm ou Yarn — para instalar o pacote SDK
  • Uma conta no Paywallo com um App Key — disponível em Configurações → Aplicativos

O que é o Paywallo?

Infra de monetização pro seu app. Instala o SDK uma vez e controla tudo pelo dashboard, sem deploy.

  • Paywalls editáveis pelo dashboard, sem atualizar o app
  • Eventos custom e funnels de conversão
  • Feature flags com rollout gradual e testes A/B
  • Campanhas de monetização segmentadas
  • Revenue analytics e projeções de MRR

Instalação

1. Instale o pacote NPM

npm install @virex-tech/paywallo-sdk

ou se você usa Yarn:

yarn add @virex-tech/paywallo-sdk

iOS — instale os pods nativos:

cd ios && pod install

Opcional — se seu app usa Facebook Ads ou precisa do IDFA (identificador de publicidade da Apple):

npm install expo-tracking-transparency

Isso habilita o prompt de ATT (App Tracking Transparency). Sem ele, o SDK funciona normalmente mas sem coleta de IDFA.

2. Configure o SDK no App.tsx

import { PaywalloProvider } from '@virex-tech/paywallo-sdk'; export default function App() { return ( <PaywalloProvider config={{ appKey: 'sua_app_key_aqui', debug: __DEV__, }} > <YourApp /> </PaywalloProvider> ); }

Substitua sua_app_key_aqui pela App Key do seu aplicativo (disponível em Configurações no dashboard)

3. Identifique o usuário (opcional)

import { Paywallo } from '@virex-tech/paywallo-sdk'; // Após login do usuário await Paywallo.identify({ email: 'usuario@exemplo.com', properties: { name: 'João Silva', plan: 'premium', }, });

Associa eventos futuros a esse usuário e permite segmentação por atributos no dashboard.

Primeiro Uso

Rastreie seu primeiro evento

import { Paywallo } from '@virex-tech/paywallo-sdk'; // Evento simples Paywallo.track('app_opened'); // Evento com propriedades Paywallo.track('button_clicked', { properties: { buttonId: 'signup', screen: 'onboarding', }, });

Exiba um paywall

import { Paywallo } from '@virex-tech/paywallo-sdk'; // Exibir paywall por placement const result = await Paywallo.presentPaywall('onboarding'); if (result.purchased) { console.log('Usuário realizou compra!'); } else if (result.cancelled) { console.log('Usuário fechou o paywall'); }

Dicas de Boas Práticas

  • •Envolva seu app com PaywalloProvider o mais cedo possível no ciclo de vida do app (App.tsx)
  • •Use preloadCampaign() logo após a inicialização para pré-carregar os dados da campanha e garantir exibição instantânea do paywall (sem delay de rede na hora que o usuário ver a tela)
  • •Use identify() logo após o login para associar eventos ao usuário
  • •Teste em modo de desenvolvimento antes de publicar para produção (use diferentes App Keys)

Próximos Passos

Rastreamento de Eventos

Rastreie ações dos usuários e envie propriedades customizadas para análise

Criando Paywalls

Crie e exiba paywalls visuais para monetizar seu aplicativo sem atualizar o app

Campanhas

Configure campanhas de monetização e use preloadCampaign() para carregamento antecipado

Feature Flags

Controle features remotamente e faça testes A/B sem publicar nova versão

Métricas Customizadas

Crie e visualize métricas personalizadas com base nos eventos do seu app

Webhooks

Receba notificações em tempo real de compras, renovações e cancelamentos

Referência do SDK

Todos os métodos, hooks e tipos do SDK com exemplos

Visão Geral da Documentação

Página inicial da documentação com todos os tópicos disponíveis

Paywallo | Analytics, Gestão de Paywalls e Feature Flags