Introdução

O Checkout é a camada responsável pelo fluxo de finalização de compra. É aqui que o cliente consulta o carrinho, realiza autenticação, adiciona endereço para entrega e finaliza o pagamento.

Na plataforma Uappi, o Checkout foi pensado para oferecer liberdade total de implementação.

Ele pode ser construído de diferentes formas, de acordo com a necessidade do projeto:

• Como um projeto separado (padrão mais comum)
• Como um modal dentro do próprio Store Theme
• Ou qualquer outra abordagem que faça sentido para a experiência desejada

Aqui, a criatividade não tem limite — desde que respeitando o fluxo e as integrações com a plataforma.

Toda a comunicação com o backend acontece por meio da API Pública, garantindo:

• Segurança
• Desacoplamento entre front-end e backend
• Flexibilidade para diferentes arquiteturas

Este guia foi criado para quem deseja:

• Criar um tema de checkout com experiências totalmente personalizadas
• Entender o fluxo completo de desenvolvimento, do ambiente local ao deploy
ℹ️ Informação

Se você deseja apenas utilizar um tema de Checkout fornecido pela Uappi, não é necessário desenvolver nada.
Você pode realizar personalizações simples diretamente pelo painel da plataforma.

---

🧩 Modelo de trabalho na Uappi

Antes de iniciar qualquer desenvolvimento, é obrigatório solicitar a configuração do ambiente do checkout junto à plataforma Uappi.

Este guia parte do princípio de que:

• A Uappi já entregou o ambiente configurado
• O repositório GitLab já existe com o projeto modelo
• Você apenas irá clonar o projeto para sua máquina e iniciar o desenvolvimento
ℹ️ Informação

Não é esperado (nem recomendado) criar um projeto do zero fora desse fluxo.

🧭 O que você vai aprender neste tópico

Ao longo deste conteúdo, você vai passar por todas as etapas necessárias para trabalhar com Checkout na Uappi:

• Entender o que é o Checkout e qual seu papel na arquitetura da plataforma
• Preparar o ambiente de desenvolvimento local
• Clonar e rodar o checkout exemplar fornecido pela Uappi
• Compreender como funcionam persistência de dados (já configuradas)
• Conhecer a estrutura base do projeto
• Consumir a API Pública, com e sem o uso do Public SDK
• Configurar eventos de rastreamento (GTM) via Public SDK
• Boas práticas e deploy

💡 Importante saber desde o início

• Este guia é focado exclusivamente em Checkout
• Não é necessário conhecimento da API Privada
• Pontos críticos como persistência de dados já vêm resolvidos no projeto modelo
• A recomendação da plataforma é seguir a estrutura fornecida, personalizando apenas o necessário

🏁 Próximo passo

Agora que você entende como funciona o modelo de desenvolvimento de Checkout na Uappi e como o ambiente é provisionado, veja também:

Pré-requisitos: tecnologias necessárias e configuração do ambiente Nessa etapa, vamos abordar:

• Node.js, NVM e Git
• Clonagem do projeto modelo no GitLab da Uappi