Como implantar sites e apps web do Google AI Studio

Implante seu site ou app web do Google AI passo a passo usando GitHub e Hostinger. Instruções simples e claras para colocar seu projeto online e plenamente funcional.

Roadmap e recursos

Escolha o plano de hospedagem e configure seu site

Escolha seu plano de hospedagem

Hostinger Business Plan

Escolha o plano mostrado no vídeo e continue o guia.

RECOMMENDED

https://www.hostg.xyz/SHJ9N

Reivindique seu domínio grátis

Conclua o pagamento e a configuração da conta

Crie um novo site usando Empty PHP/HTML Website

Prepare seu projeto dentro do Google AI

Abra seu projeto do Google AI

Clique em Save to GitHub

Crie um novo repositório

Clique em Add Changes para subir o projeto inteiro

Conecte seu projeto à Hostinger

Volte para a Hostinger

Escolha Node.js Web App

Clique em Continue with GitHub

Selecione o mesmo repositório

A Hostinger detecta o Vite automaticamente (sem mudanças necessárias)

Adicionar a API key do Gemini necessária

Adicione a API key do Gemini como variáveis de ambiente

API_KEY GOOGLE_API_KEY GEMINI_API_KEY VITE_GOOGLE_API_KEY VITE_GEMINI_API_KEY

API_KEY

Chave de API do Gemini

GOOGLE_API_KEY

Chave de API do Gemini

GEMINI_API_KEY

Chave de API do Gemini

VITE_GOOGLE_API_KEY

Chave de API do Gemini

VITE_GEMINI_API_KEY

Chave de API do Gemini

Obtenha esta chave no Google AI Studio

Abrir chaves de API

https://aistudio.google.com/app/apikey

Implante seu site + corrija o problema da tela branca

Clique em Deploy

Conecte seu domínio

Se aparecer uma tela branca, rode o seguinte prompt no Google AI

Prompt para corrigir tela branca

Ele faz deploy sem erros, mas em produção exibe uma tela branca…

It deploys without errors, but in production, it renders a blank white page. No console errors appear. The issue occurs on multiple hosting providers, so it is not a hosting problem. Please debug the app and fix the root cause so it renders properly in production, without changing the existing UI.

Save → Stage → Commit no GitHub

A Hostinger faz o re-deploy da atualização automaticamente

✨ Workflow final

Resumo final do workflow

O Google AI constrói seu projeto O GitHub sincroniza as mudanças A Hostinger faz o deploy de tudo automaticamente Qualquer atualização futura no Google AI → no ar instantaneamente no seu site