Desenvolver apps de pilha completa no Google AI Studio

O Google AI Studio agora oferece suporte ao desenvolvimento full-stack, permitindo que você crie aplicativos que vão além dos protótipos do lado do cliente. Com um ambiente de execução do lado do servidor, é possível gerenciar secrets, conectar-se a APIs externas e criar experiências multiplayer em tempo real.

Ambiente de execução do lado do servidor

Os aplicativos do Google AI Studio agora podem incluir um componente do lado do servidor (Node.js). Isso permite que você:

  • Executar a lógica do lado do servidor: execute o código que não deve ser exposto ao cliente.
  • Acessar pacotes npm: o agente do Antigravity pode instalar e usar pacotes do vasto ecossistema npm.
  • Processar secrets: use chaves de API e credenciais com segurança.

Usar pacotes npm

Não é necessário executar npm install manualmente. Basta pedir ao agente para adicionar uma funcionalidade que exija um pacote, e ele vai cuidar da instalação e da importação.

Exemplo: > "Use axios para buscar dados da API externa."

Gerenciar secrets com segurança

Com o código do lado do servidor e o gerenciamento de secrets, agora é possível criar apps que interagem com o mundo.

Chave de API Gemini

Quando você cria um novo app que usa a API Gemini, o AI Studio configura automaticamente seu GEMINI_API_KEY como um secret do lado do servidor, sem necessidade de configuração manual. Você pode ver essa chave no painel Secrets em "Configurações". As chamadas da API Gemini do seu app são feitas pelo código do servidor usando essa chave, então ela nunca é exposta no navegador.

Chaves de API de terceiros

Para outros serviços, é possível adicionar chaves de API manualmente:

  • APIs de terceiros: conecte-se a serviços como Stripe, SendGrid ou APIs REST personalizadas.
  • Bancos de dados: conecte-se a bancos de dados externos (por exemplo, via Supabase, Firebase ou MongoDB Atlas) para persistir dados além da sessão.

Ao criar apps reais, geralmente é necessário se conectar a serviços de terceiros (como Twilio, Slack ou bancos de dados) que exigem chaves de API. Para adicionar chaves manualmente, siga estas etapas:

  1. Adicionar um secret: acesse o menu Configurações no Google AI Studio e procure a seção "Secrets".
  2. Armazenar sua chave: adicione suas chaves de API ou tokens secretos aqui.
  3. Acesso no código: o agente pode escrever código do lado do servidor que acessa esses secrets de forma segura (geralmente por variáveis de ambiente), garantindo que eles nunca sejam expostos ao navegador do lado do cliente.

Quando necessário, o agente também vai mostrar um card no chat solicitando que você adicione chaves sempre que um novo secret for necessário ou quando uma nova chave for detectada nas variáveis de ambiente do projeto.

Integração com o Firebase para banco de dados e autenticação

Agora, o Google AI Studio facilita a adição de um banco de dados ou de autenticação ao seu app por meio de uma integração com o Firebase. O agente do Antigravity pode provisionar e configurar os seguintes serviços para você automaticamente:

  • Banco de dados do Firestore: um banco de dados NoSQL flexível e escalonável na nuvem para armazenar e sincronizar dados para desenvolvimento do lado do cliente e do lado do servidor.
  • Firebase Authentication: permita que os usuários façam login com segurança no seu aplicativo usando os fluxos do recurso "Fazer login com o Google".

Basta pedir ao agente para "adicionar um banco de dados ao meu app" ou "configurar o Login do Google", e ele vai cuidar da configuração e da geração de código necessárias para você. Ao criar apps Android, a integração do Firebase também provisiona o Firebase AI Logic e o Firebase App Check para chamadas de API Gemini seguras do lado do cliente.

Você pode começar a usar o Firebase sem custos financeiros e, se quiser, fazer upgrade para uma conta para pagamentos quando precisar de mais cota ou quiser usar recursos pagos.

APIs do Google Workspace

Com o Google AI Studio, você pode criar apps que se conectam às APIs do Google Workspace para que seus usuários possam trabalhar com dados reais: e-mails, planilhas, documentos, eventos da agenda e muito mais, tudo no seu app. Você não precisa mais configurar um projeto na nuvem do Google, configurar o OAuth ou gerenciar sua API manualmente.

Como funciona

É possível adicionar uma integração do Workspace de duas maneiras:

  • Descreva no painel de conversa: basta dizer ao agente o que você quer no painel de conversa na parte de baixo. Por exemplo, "Crie um rastreador de despesas que registre os recibos na minha planilha do Google" ou "Crie um painel que resuma minhas mensagens não lidas do Gmail".
  • Selecione no painel de integrações: abra o painel Integrações na barra lateral direita do modo de criação e ative o app do Workspace que você quer conectar.

Quando você adiciona um app do Workspace, o AI Studio automaticamente:

  1. Conecta a API do Google necessária para seu app.
  2. Gera o código do lado do servidor para chamar a API.
  3. Adiciona um fluxo seguro de "Fazer login com o Google" para que os usuários finais do seu app possam autorizar o acesso aos próprios dados.

Apps com suporte

Os seguintes apps do Google Workspace estão disponíveis:

App O que você pode criar
Google Agenda Ler, criar e gerenciar eventos e agendas
Google Chat Ler e interagir com conversas e espaços em grupo
Google Docs Criar, ler, atualizar e formatar documentos
Google Drive Organizar, pesquisar e gerenciar arquivos e pastas
Google Formulários Criar pesquisas, atualizar perguntas e recuperar respostas
Gmail Ler, enviar e gerenciar conteúdo de e-mail
Google Keep Gerenciar notas, listas e anexos
Google Meet Agendar e gerenciar videochamadas
Contatos Sincronizar e gerenciar contatos
Google Planilhas Ler, gravar e formatar dados de planilhas
Google Slides Criar e modificar apresentações
Google Tarefas Criar, gerenciar e organizar tarefas

Autenticação e permissões

Como criador, você não precisa configurar clientes OAuth, gerenciar credenciais ou configurar um projeto do Google Cloud. O AI Studio cuida de tudo isso para você.

Os apps com APIs do Workspace integradas usam o recurso "Fazer login com o Google" para autenticar os usuários finais. Quando um usuário abre seu app, ele precisa fazer login e conceder as permissões específicas necessárias (por exemplo, acesso somente leitura à agenda ou permissão para editar uma planilha). Seu app acessa apenas os dados da pessoa que o está usando. Cada usuário autoriza o acesso à própria conta.

Exemplos de comandos

Confira algumas ideias para começar a usar as integrações do Workspace:

  • "Crie um app que leia meu Google Agenda e rascunhe e-mails de preparação no Gmail para cada reunião."
  • "Crie uma ferramenta que use um documento Google e gere uma apresentação de resumo de 5 slides nas Apresentações Google."
  • "Crie um controle de despesas em que eu faça upload de um recibo, o Gemini extraia os detalhes e registre uma nova linha na minha planilha do Google."

Configurar o OAuth

Um caso de uso importante para o gerenciamento de secrets é configurar o OAuth para se conectar a outros sites ou apps. Quando o comando inclui instruções sobre como se conectar a um app de terceiros que exige autenticação OAuth, o agente fornece instruções sobre como configurar o OAuth para esse aplicativo. Essas instruções incluem os URLs de callback necessários para configurar o aplicativo OAuth. Você também pode encontrar os URLs de callback em Integrações no painel "Configurações".

Criar experiências multiplayer

O ambiente de execução full-stack permite recursos de colaboração em tempo real.

  • Estado em tempo real: você pode pedir ao Agente para criar recursos como "um chat ao vivo", "uma lousa interativa colaborativa" ou "um jogo multiplayer".
  • Sessões sincronizadas: o servidor gerencia o estado, permitindo que vários usuários interajam com a mesma instância do aplicativo em tempo real.

Exemplo de comando: > "Transforme isso em um jogo multiplayer em que os jogadores possam ver os cursores uns dos outros."

Dicas para testar apps multiplayer

Você pode testar o modo multiplayer de duas maneiras antes de implantar o app.

  1. Abra seu app no modo de criação do Google AI Studio em várias guias. Ao desenvolver no modo de build, o app fica em um contêiner de desenvolvimento. Abrir o app em várias guias permite simular vários jogadores usando o app.
  2. Compartilhe o app com outras pessoas usando o menu Compartilhar no canto superior direito. Em seguida, use o URL compartilhado na guia Integrações do menu Compartilhar para usar o app com os jogadores com quem você o compartilhou.

Práticas recomendadas

  • Chamadas da API Gemini: sua GEMINI_API_KEY é configurada automaticamente como um secret do lado do servidor. Faça chamadas da API Gemini no código do servidor usando essa chave. Você pode conferir no painel Secrets.
  • Segurança de secrets: sempre use o Secret Manager para chaves sensíveis. Nunca os fixe no código nos seus arquivos.
  • Separação de responsabilidades: mantenha a lógica da interface no framework do lado do cliente (React/Angular) e a lógica de negócios/processamento de dados no lado do servidor.
  • Tratamento de erros: verifique se o código do lado do servidor lida de forma robusta com erros de chamadas de API externas para evitar que o app falhe.

A seguir