Crie sites animados com Claude Code do zero (Guia completo)
Chiara Costa
0:00 / 0:00
Crie sites animados com Claude Code do zero (Guia completo)
873 просмотра · 8 ч назад
Chiara Costa
52,7 тыс. подписчиков
873 просмотра · 8 ч назад
🎨 Higgsfield (crie sua conta e confira as promoções) ➜ https://higgsfield.ai/s/mcp-a_chiaraa...
🚀 Publique seu site com a Hostinger ➜ https://www.hostg.xyz/SHKI7
10% de desconto em QUALQUER plano aplicando o cupom: PNP no checkout
🎁 Skill gratuita para criar sites animados ➜ https://link.vibecodingnapratica.com....
💻 Baixar o app desktop do Claude ➜ https://claude.com/download
🎓 Comunidade gratuita no Skool ➜ https://www.skool.com/@vibe-coding-na...
💡 Curso Vibe Coding na Prática ➜ https://link.vibecodingnapratica.com....
Neste vídeo você aprende a criar um site animado, com vídeo de abertura controlado pelo scroll e imagens geradas por inteligência artificial, usando o Claude Code e sem precisar de designer. Mostro como configurar o Claude Code, conectar o Higgsfield para gerar imagens e vídeos, instalar uma skill gratuita, revisar o resultado e publicar na Hostinger com domínio próprio. Você também vê como alterar o site depois de publicado, do zero ao site no ar.
📌 O que você vai aprender nesse vídeo:
00:00 - O site que derrama café enquanto você rola a página
00:41 - Pré-requisitos: conta e app desktop do Claude
01:01 - Aba Code, modelo Opus 5.5 e modo de permissão
02:04 - Conectando o Higgsfield ao Claude Code
03:48 - Instalando a skill gratuita
04:35 - Briefing: as perguntas da skill e a marca fictícia
05:38 - Escolhendo o conceito do vídeo de abertura e a imagem base
06:51 - Escolhendo o modelo e gerando o vídeo
07:43 - Resultado: o site pronto
08:27 - Pedindo alterações com anotações no chat
09:30 - Publicando o site com a Hostinger (plano e cupom)
11:14 - Conectando a Hostinger ao Claude e fazendo o deploy
11:45 - Colocando o site em um domínio personalizado
12:35 - Como alterar o site depois de publicado (e dica bônus)
14:13 - Recapitulação do processo
CONTATOS
📩 Parcerias ➜ contato@paginasnapratica.com.br
💼 Orçamentos para serviços ➜ https://projetos.vibecodingnapratica....