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 é Next.js?

Next.js é um framework React para construção de aplicações web full-stack. Ele suporta renderização no servidor, geração estática e outras estratégias modernas. Visite o site oficial do Next.js para saber mais.

Instalação

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

Frontend

Para criar interfaces de pagamento no frontend, use o componente Checkout:
app/checkout/page.tsx
import { Checkout, CheckoutValues } from 'pagamentos/react'

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

  return (
    <Checkout 
      onSubmit={onSubmit}
      metodoPagamento={[
        'pix',
        'boleto',
        'cartaoCredito'
      ]}      
    />
  )
}

Backend (API Routes)

No Next.js App Router, crie um route.ts para tratar webhooks:
app/api/webhook/route.ts
import { toNextJs } from 'pagamentos/nextjs'
import { pg } from '@/pagamentos'

export const POST = toNextJs(pg.webhooks.handler)