Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.pagamentos.dev/llms.txt

Use this file to discover all available pages before exploring further.

O que é React?

React é uma biblioteca JavaScript para construir interfaces de usuário. Ele é amplamente utilizado para criar aplicações web interativas e responsivas. Visite o site oficial do React para saber mais.
React é uma biblioteca de frontend. Isso significa que ele é executado no navegador do usuário e você pode usá-lo para criar interfaces de pagamento.Para lidar com a lógica de pagamento, como criar cobranças, processar pagamentos e lidar com webhooks, você ainda precisará de um backend. Confira o guia de integração com Backend para saber como configurar.

Instalação

Para começar o desenvolvimento, instale a biblioteca com seu gerenciador de pacotes favorito:
npm i pagamentos

Seu primeiro componente

Vamos usar o componente Checkout para criar um checkout de pagamento simples:
import { Checkout, CheckoutValues } from 'pagamentos/react'

export function CheckoutPage() {
  async function onSubmit(data: CheckoutValues) {
    console.log('Dados do pagamento:', data)
  }

  return (
    <Checkout 
      onSubmit={onSubmit}
      metodoPagamento={[
        'pix',
        'boleto',
        'cartaoCredito'
      ]}      
    />
  )
}
Ao carregar a página, você verá um formulário de checkout com os métodos de pagamento especificados. Quando o usuário preencher o formulário e enviar, os dados do pagamento serão registrados no console.