O HubSpot é uma ótima ferramenta para criar sites. Ele permite que os desenvolvedores criem partes personalizadas, chamadas módulos. As equipes de marketing podem usar esses módulos facilmente para construir páginas da web apenas arrastando e soltando.
Mas construir muitos desses módulos leva muito tempo. Pode ficar muito chato porque os desenvolvedores precisam escrever exatamente o mesmo tipo de código várias e várias vezes. Eles precisam escrever longos arquivos de configuração, criar o HTML e garantir que tudo fique bonito em todos os dispositivos.
Hoje, muitos desenvolvedores estão usando ferramentas de IA como o ChatGPT ou o GitHub Copilot para trabalhar mais rápido. A IA não é perfeita. Ela não pode fazer tudo por você. Mas, se você usá-la de forma inteligente, ela pode economizar horas de trabalho chato.
Este guia explica como os desenvolvedores do HubSpot podem usar a IA para construir módulos mais rápido, mantendo o código limpo e fácil de usar.
Por Que Criar Módulos no HubSpot Demora Tanto?
O HubSpot te dá muito poder, mas também faz com que os desenvolvedores tenham muito trabalho de configuração manual para cada módulo.
1. Escrevendo o arquivo fields.json
Todo módulo precisa de um arquivo chamado fields.json. Este arquivo diz ao HubSpot quais botões e caixas de texto mostrar para a equipe de marketing. Mesmo para um módulo simples, você precisa digitar o código para:
- Caixas de texto (Text boxes)
- Carregadores de imagens (Image uploaders)
- Seletores de cores (Color pickers)
- Listas de repetição (Repeating lists)
Digitar esse código para dezenas de módulos demora uma eternidade e é muito fácil cometer erros de digitação.
2. Escrevendo o Código e a Lógica
O HubSpot usa uma linguagem de programação chamada HubL. Os desenvolvedores misturam o HubL com o HTML normal para fazer as páginas da web funcionarem. Eles precisam escrever os mesmos loops básicos e regras "if" (se) todos os dias. Fazer esse trabalho repetitivo tira o tempo que poderia ser usado para resolver problemas maiores.
3. Deixando Tudo Bonito
Depois que o código básico está pronto, os desenvolvedores ainda precisam escrever o CSS para deixar o módulo bonito. Eles precisam testar em celulares e garantir que seja fácil de usar para pessoas cegas que usam leitores de tela. Todos esses passos se somam.
Como a IA Ajuda os Desenvolvedores a Trabalhar Mais Rápido
A IA não pode construir um módulo perfeito do HubSpot sozinha a partir de um simples comando. No entanto, ela é incrível para fazer a digitação chata e repetitiva para você.
Gerando os Arquivos de Configuração
Uma das melhores maneiras de usar a IA é deixá-la escrever o seu arquivo fields.json. Você pode simplesmente dizer à IA o que você precisa em palavras simples. Por exemplo, você pode dizer: "Faça um arquivo fields.json para um cartão de preços com um título, uma foto e um botão."
A IA vai digitar rapidamente todo o código inicial. Você ainda precisa verificar para ter certeza de que está certo, mas isso te salva de todo aquele trabalho pesado de digitação.
Criando Trechos de Código Básicos
A IA é bem inteligente quando se trata de código HubL básico. Ela pode escrever rapidamente os padrões de código que você usa todos os dias, como:
- Escrever o código para mostrar uma imagem corretamente.
- Escrever um loop para mostrar uma lista de itens.
- Escrever uma regra para esconder uma caixa se o usuário a deixar vazia.
Gerando Layouts Básicos
Muitos sites usam os mesmos tipos de layout, como uma grade de recursos ou uma lista de avaliações de clientes. Em vez de começar com uma página em branco, você pode pedir à IA para escrever o HTML básico para você. Depois, você pode intervir e adicionar o código especial do HubSpot para fazer funcionar.
Encontrando Respostas Rapidamente
O HubSpot tem muitas regras. Em vez de procurar em longas páginas de manuais de instruções, os desenvolvedores podem simplesmente fazer uma pergunta à IA. A IA pode te dar um resumo rápido e mostrar um exemplo do código que você precisa.
Onde a IA Ainda Comete Erros
Você não pode confiar na IA cegamente. Se você fizer isso, seu site pode quebrar. Você precisa saber onde a IA se confunde.
Inventando Regras
Às vezes, a IA simplesmente inventa coisas. Ela pode tentar usar um tipo de campo que o HubSpot nem suporta. Ela pode escrever errado uma propriedade ou esquecer um ID obrigatório. Um desenvolvedor precisa sempre verificar o trabalho da IA usando as regras reais do HubSpot.
Lidando com Dados Complexos
Se o seu módulo precisa puxar dados complexos de um banco de dados (como o HubDB), a IA costuma ficar muito confusa. Ela tem dificuldade em escrever buscas e filtros complexos. Para as coisas difíceis, os desenvolvedores humanos ainda são muito melhores.
Não Está Pronta para Usuários Reais
A IA não sabe como é o seu site inteiro. Ela pode escrever um código que seja difícil para a equipe de marketing entender no editor. Um humano sempre precisa revisar o módulo e garantir que ele seja fácil de usar antes de colocá-lo em um site no ar.
A Melhor Maneira de Usar a IA
Desenvolvedores espertos usam a IA como uma assistente útil. Aqui está um fluxo de trabalho simples, passo a passo, que funciona muito bem:
- Planeje: Decida o que o seu módulo precisa fazer e de quais campos ele precisa.
- Deixe a IA digitar o básico: Peça à IA para escrever o arquivo
fields.jsonbásico e o código HTML inicial. - Corrija os erros manualmente: Verifique o código da IA. Corrija os erros e conecte os dados do HubSpot corretamente.
- Deixe perfeito: Adicione o seu próprio estilo para que fique lindo em celulares e computadores.
- Teste: Tente usar o módulo no HubSpot para ter certeza de que é fácil de usar para todos.
Considerações Finais
A IA não vai roubar o emprego de um desenvolvedor do HubSpot. Mas é uma ferramenta super útil. Ao deixar a IA fazer a digitação chata e a configuração básica, os desenvolvedores podem economizar horas de tempo todas as semanas.
O segredo é saber no que a IA é boa e saber exatamente quando você precisa intervir e fazer o trabalho real.
Construir módulos do HubSpot do zero leva tempo. O Rapid permite que você faça upload de qualquer captura de tela de interface (UI) e gera um módulo do HubSpot completo e pronto para uso (com fields.json, código HubL e estrutura correta) em menos de 60 segundos. Experimente grátis →