Перейти к содержимому

Como Criar um Checkout Completo com MercadoPago, React e Node.js (Passo a Passo)

Hashtag Dev

0:00 / 0:00

Como Criar um Checkout Completo com MercadoPago, React e Node.js (Passo a Passo)

8 178 просмотров · 9 мес. назад
Hashtag Dev
11,8 тыс. подписчиков
8 178 просмотров · 9 мес. назад
🖥️ Aprenda a integrar Mercado Pago com React e Node.js e crie um checkout completo, seguro e profissional passo a passo! ----------------------------------------------------------------------- 🎓 Quer saber mais sobre o nosso Curso Completo de Full Stack? Acesse o link abaixo para garantir sua vaga na próxima turma: https://lp.hashtagtreinamentos.com/fu... 📘 Acesse o Minicurso Gratuito de HTML e CSS: https://pages.hashtagtreinamentos.com... ----------------------------------------------------------------------- 📁 Arquivos Utilizados no Vídeo: https://dlp.hashtagtreinamentos.com/f... ----------------------------------------------------------------------- 🤖 HashIA Os melhores modelos de IA em um único lugar, por um único preço A única ferramenta de IA que você vai precisar no mercado de trabalho https://www.hashtagtreinamentos.com/h... ----------------------------------------------------------------------- 💻 Vídeos recomendados: Playlist Projeto Completo Réplica do Airbnb com MERN    • Projeto Completo Réplica do Airbnb com MERN   Como Criar uma API REST com Node.js e Express em 16 Minutos!    • Como Criar uma API REST com Node.js e Expr...   AXIOS vs FETCH: Qual a melhor forma de consumir APIs    • AXIOS vs FETCH: Qual a melhor forma de con...   Como o Front e o Back se Comunicam? (Explicação com Projeto Real)    • Como o Front e o Back se Comunicam? (Expli...   ----------------------------------------------------------------------- 🧑‍💻 PARA CONTRATAR A HASHTAG PARA SUA EMPRESA: https://www.hashtagtreinamentos.com/t... ----------------------------------------------------------------------- 💰 Quer aprender a criar um checkout completo e profissional com Mercado Pago, React e Node.js do zero? Neste vídeo, você integra o front-end com o back-end pela API oficial do Mercado Pago, cria a preferência de pagamento, configura as URLs de sucesso, erro e pendência e gera o link de checkout, passo a passo e com código real. Você usa Axios no React, Express no Node.js e dotenv, e testa pagamentos com as credenciais de teste do Mercado Pago. Ideal para aprender integrações de pagamento, APIs REST e full stack com JavaScript. 🔔 Curtiu? Deixa o like, se inscreve e ativa o sininho pra mais Node.js, React e Mercado Pago! ----------------------------------------------------------------------- 📌 Hashtag Dev ► Inscreva-se em nosso canal: https://eventoshashtag.herokuapp.com/... ► Ative as notificações (clica no sininho)! ► Curta o nosso vídeo! ----------------------------------------------------------------------- 🔗 Redes Sociais ► Blog: https://www.hashtagtreinamentos.com/blog ► YouTube: https://eventoshashtag.herokuapp.com/... ► Instagram:   / hashtagprogramacao   ► Facebook:   / hashtagprogramacao   ► Tik Tok:   / hashtagprogramacao   ----------------------------------------------------------------------- ⏱️ Conteúdo da Aula 00:00 Introdução ao checkout com Mercado Pago e visão geral do projeto 00:34 Acessando e configurando a API do Mercado Pago 01:45 Criando e autenticando sua aplicação no Mercado Pago Developers 04:02 Integração do Mercado Pago com Node.js passo a passo 07:10 Estrutura inicial do projeto e arquivos necessários 09:37 Criando endpoint e requisição GET para gerar preferências 12:55 Importando o SDK do Mercado Pago no backend Node.js 13:55 Definindo o produto e configurando o corpo da requisição (body) 16:07 Configurando URLs de redirecionamento e retornos da API 17:15 Substituindo then/catch por Try Catch para melhor tratamento de erros 19:00 Executando e testando o servidor Node.js localmente 22:12 Usando Axios para consumir o endpoint de pagamento 25:55 Testando o checkout com credenciais de teste do Mercado Pago 26:38 Implementando o redirecionamento automático para o checkout 27:15 Conclusão e próximos passos #fullstack #htmlecss #ia #html #css #javascript #hashtagdev