Você pode codificar e implantar um aplicativo básico, mas funcional, com experiência mínima de codificação? Com o mais recente recurso do Google AI Studio, você pode criar e implantar aplicativos instruindo um agente em minutos. Você também pode implantar o aplicativo no Google Cloud Run e fazer alterações facilmente. Este post mostrará como. Vamos começar!
Índice #
O objetivo #
Seu objetivo é construir um aplicativo GEN AI (LLM)- que terá uma imagem (de um local popular) e, em seguida, devolverá o país, cidade, estado, local e as coordenadas de geolocalização daquele lugar. Um uso criativo disso pode estar perseguindo e sabendo onde seus amigos foram usando suas fotos do Instagram. Outros usos dependem de você. Este é mais um projeto divertido de prova de prova para demonstrar o poder do LLM e da Gen AI com os modelos Gemini 2.5.
Crie um aplicativo com um prompt no Google AI Studio #
Vá para Google AI Studioentão clique no Build Link no menu esquerdo, como mostrado abaixo:
Em seguida, cole o seguinte na área de texto imediata;
Build an app that can guess Geo location from a given image:
You are an OSINT investigator. Your job is to geolocate where the photos are taken.
Provide the country, region, and city name of the location.
Please pinpoint the exact location with latitude and longitude where the photo was taken.
Could you always explain your methodology and how you concluded?
Provide steps to verify your work.
Also, mention the percentage of how sure you are of the place you have identified it to be
and add a Google Maps link to the exact location
Vai parecer algo abaixo:
Depois disso, clique no azul Build botão. Ele usará um agente de código/assistente como Google Jules AI e comece a “pensar” e escrever todo o aplicativo, como visto abaixo:
Levará alguns minutos (ou um pouco mais) e, em seguida, gerará o aplicativo completo no React e no TypeScript. Ele usa CSS de Tailwind para estilo. Quando a geração de aplicativos estiver concluída, ele parecerá o seguinte:
A visualização do aplicativo está disponível no painel direito, para que você possa fazer upload e testar uma imagem como esse um (estátua da liberdade). Ele analisará a foto e adivinhará a localização geográfica da seguinte forma:
Você pode até clicar no link do Google Maps fornecido e ver onde está o local. Você pode rolar para baixo para ver a metodologia e as etapas de verificação, como visto abaixo:
Na próxima seção, você implantará o aplicativo gerado (codificado por vibe) no Google Cloud Run.
Implante no Google Cloud Run #
Google Cloud Run é uma plataforma de computação totalmente gerenciada que dimensiona automaticamente seus contêineres sem estado. É uma ótima maneira de implantar seus aplicativos sem se preocupar com a infraestrutura subjacente.
Você precisará de um projeto existente e alguns créditos na sua conta do Google Cloud para implantar no Google Cloud Run. Se você não possui um projeto existente no Google Cloud, pode criar um novo Como visto abaixo:
Levará algum tempo e o projeto será criado; Você será notificado disso. No meu caso, o nome do projeto é geo-location-appe parecerá o seguinte:
Para implantar o aplicativo gerado (codificado por vibração) que você testou. Voltar para o Build página do aplicativo gerado. No Preview Seção à direita, clique no ícone preto e branco do foguete (🚀) no canto superior direito acima Preview:
Em seguida, pesquise e selecione o projeto que você acabou de criar no Google Cloud Console, no meu caso, é geo-location-appclique no Deploy app Botão azul da seguinte forma:
Levará algum tempo para implantar o aplicativo React no Google Cloud Run, começando com a verificação do projeto:
Então vai mostrar Deploying to Cloud Run E, finalmente, dê -lhe um link para experimentar seu aplicativo de adivinhação de localização geográfica, como visto abaixo:
Você pode clicar no App URL link ou o View app Botão para ver o aplicativo funcionando em um URL acessível ao público, o mesmo que você testou na visualização. Quando você clica no View app Botão azul, você verá o aplicativo em ação:
Você pode fazer upload da mesma estátua da liberdade foto ou qualquer outro marco famoso e veja como funciona:
Você também pode fazer upload de uma foto da Torre Eiffel, e ela adivinhará o local como Paris, França. Dê uma chance. Você também pode mudar do tema claro para escuro e voltar.
Seu aplicativo é salvo automaticamente e você pode encontrá-lo no Your Apps guia no estúdio do google ai Build página:
Em seguida, você aprenderá como fazer uma alteração e reimplantar o aplicativo para a nuvem.
Fazendo uma mudança e reimplementação #
Você pode fazer uma alteração no aplicativo e reimpletá -lo. No meu caso, quero remover a menção de OSINT da interface, e eu instruirei/vibe o código do Code assistant Seção do aplicativo com:
Remove all the mentions of "OSINT" from the user interface, but keep it in the prompt
Você pode inserir a nova instrução da seguinte maneira e pressionar o botão Blue Up, como visto abaixo:
Levará algum tempo para realizar a tarefa fornecida, depois de um pouco de pensamento (no meu caso, 10 segundos), ele começou a editar os arquivos. O aplicativo parecia o seguinte depois que a mudança foi feita:
Como a alteração foi feita e o aplicativo foi testado em visualização. Você pode salvar a nova alteração pressionando o ícone Salvar acima da visualização. Você pode reimpor -o ao Google Cloud Run. Para fazer isso, clique no ícone preto e branco do foguete (🚀) no canto superior direito acima Preview e selecione o mesmo projeto (foi geo-location-app No meu caso):
Ele verifica o projeto e, dado que o aplicativo já está implantado nesse projeto, fornece um Redeploy app Link, que você pode clicar para reimplantar a alteração para o Google Cloud Run:
Levará algum tempo para reimplantar o aplicativo, e você verá o Deploying to Cloud Run mensagem.
Ele reimplantará o aplicativo e fornecerá o mesmo link para o aplicativo, que você pode testar e verificar se a alteração foi implantada e liberada. Depois de clicar View appPosso ver que a atualização foi feita:
Após a mudança, testei o aplicativo para garantir que ele funcionasse conforme o esperado. Não há menção a OSINT mais, que é o que eu queria. Os créditos do Google Cloud são fornecidos para este projeto. Obrigado ao Google.
Lá está você – você codificou um aplicativo em pleno funcionamento que começou com uma ideia simples e um único prompt. Você também o implantou em um URL acessível ao público, que pode compartilhar com os amigos. Como está em execução no Google Cloud, ele custará dinheiro, portanto, verifique seus custos no faturamento do Google Cloud e interrompa o aplicativo, se necessário. Após o teste, você pode excluir o projeto com o aplicativo em execução no Google Cloud Run.
No meu caso, o prompt primário e a chamada da API estavam no Serviços/GeminiseService.ts arquivo, que estava usando gemini-2.5-flash-preview-04-17 com um prompt bastante bem elaborado. Todo o aplicativo está disponível nesta fonte aberta Repositório do GitHub. A partir do código que li, ele parece um aplicativo somente de front-end; portanto, como ele lida com a chave da API e sua segurança é de sua responsabilidade.
Você pode ler o Perguntas frequentes Na página do Google AI Studio Build/Apps, que diz que é um aplicativo apenas front -end e outros detalhes sobre como ele é executado em um iframe no Google Cloud Run.
O objetivo era ter um aplicativo de trabalho, e você o possui, mesmo com um comutador de tema escuro e claro. É um bom ponto de partida, mas eu não o consideraria pronto para produção; Use -o com cautela e com cuidado. Se você acha que algo está errado, exclua o aplicativo da Cloud Run e/ou exclua todo o projeto. Não quero que você sangra dinheiro na plataforma do Google Cloud.
Conclusão #
Neste tutorial, você começou com o objetivo de ter um aplicativo de funcionamento da Gen AI e gerado que possa adivinhar a geolocalização de uma imagem. Em seguida, você gerou o aplicativo completo usando o recurso de aplicativos/construção do Google AI Studio. Depois disso, você criou e implantou um projeto do Google Cloud no Google Cloud Run. Finalmente, você fez alterações para remover o OSINT Mencione na interface do usuário e reimplantei o aplicativo para o Google Cloud Run no mesmo projeto do Google Cloud.
É muito fácil passar de uma ideia e solicitar um aplicativo totalmente funcional acessível pela Internet e implantado no Google Cloud Run. Para gerenciar os custos de maneira eficaz, lembre -se de monitorar seu faturamento no Google Cloud e interromper o aplicativo, se necessário. Continue aprendendo e usando o Gemini e o Google AI Studio!
