Tópicos populares
#
Bonk Eco continues to show strength amid $USELESS rally
#
Pump.fun to raise $1B token sale, traders speculating on airdrop
#
Boop.Fun leading the way with a new launchpad on Solana.
Usar a página de consulta de endereço on-chain e rastreamento social do Gemini 3 vibe coding
A funcionalidade é que, ao inserir um endereço EVM, é possível rastrear informações on-chain e identidades sociais, como o x handle (semelhante ao gráfico social que era muito popular há alguns anos)
Levou 25 minutos e, no final, gerou a seguinte página front-end
Na verdade, vibe coding é muito simples, é mais conveniente do que quando eu usava o GPT-4o com Cloudflare há alguns meses
Dê instruções ao Gemini, o ponto chave é que as instruções em linguagem simples e os prompts em AI coding são diferentes, então você precisa usar a IA para gerar um prompt que o LLM consiga entender
Por exemplo, meu prompt é
Por favor, ajude-me a criar um rastreador de gráfico social Web3 de página única usando React e Tailwind CSS
Requisitos de design:
. Estilo: geek, estilo Matrix. O fundo deve ser preto profundo, com texto que tenha um leve brilho em azul ou roxo neon.
. Layout: a página deve ter um campo de busca centralizado para inserir o endereço ETH.
. Animação: após clicar em buscar, deve haver uma animação de carregamento "dados sendo escaneados" muito legal.
Exibição de resultados:
. À esquerda, exibir o "cartão de identidade" dessa pessoa: incluir foto (usar uma foto aleatória de Web3), domínio ENS e, o mais importante, a conta do Twitter (destacada).
. À direita, exibir a "rede de interações": listar 3-5 endereços com os quais ele interagiu.
Lógica de dados:
. Como eu não tenho backend, por favor, ajude-me a criar alguns dados simulados (Mock Data). Não importa qual endereço eu insira, finja que encontrou dados. Por exemplo, a pessoa padrão que aparece se chama "Vitalik", Twitter @VitalikButerin
Estrutura de arquivos:
. Por favor, escreva todo o código diretamente em um App.jsx e App.css, para que eu possa ver o efeito imediatamente.
A maior parte do tempo foi gasta em debug, pois o codificador pode não reconhecer diretamente devido a vários detalhes sutis, então ainda é necessário usar o Gemini para debugar, copiar o código, explicar detalhadamente onde está o problema e depois pedir que ele resolva...

Top
Classificação
Favoritos
