Gemini-CLI-UI: fornece uma interface web intuitiva para a CLI do Gemini.

A Gemini-CLI-UI é uma ferramenta de interface da Web de código aberto baseada na interface do Google Gêmeos Desenvolvimento da CLI. Ele permite que os desenvolvedores usem o CLI do Gemini para simplificar a codificação. Os usuários podem acessá-lo em qualquer dispositivo, incluindo telefones celulares, tablets e computadores. A ferramenta oferece uma interface de bate-papo intuitiva, gerenciamento de arquivos, edição de código e manipulação do Git. Ela suporta interação em tempo real, gerenciamento de sessões e várias linguagens de programação para que os desenvolvedores trabalhem rapidamente no código e no gerenciamento de projetos. O projeto está licenciado sob a GNU General Public License v3.0, e o código está disponível publicamente para que os usuários o utilizem e modifiquem livremente.

Lista de funções

• Design responsivo com suporte a vários dispositivos para desktop, tablet e celular.
• Interface de bate-papo integrada para interagir com a CLI do Gemini em tempo real para obter orientação sobre codificação de IA.
• Integre o Terminal para executar comandos CLI do Gemini diretamente de uma página da Web.
• Navegador de arquivos com suporte para visualização da estrutura do projeto, edição de arquivos e realce de sintaxe.
• Integração com o Git, visualização de alterações, troca de ramificações, confirmação de código.
• Gerenciamento de sessões, salvamento e restauração de conversas, rastreamento de histórico.
• Compatível com uma ampla gama de modelos Gemini, incluindo o Gemini 2.5 Pro.
• Recurso de carregamento de imagens para carregar imagens e fazer perguntas no bate-papo.
• Modo YOLO para ignorar os avisos de confirmação e acelerar as operações.

Usando a Ajuda

Processo de instalação

O Gemini-CLI-UI é uma ferramenta baseada na Web que requer a clonagem do repositório do GitHub e a configuração do ambiente. Veja a seguir as etapas detalhadas de instalação:

1. Garantir o meio ambiente
   Certifique-se de que você tenha o Node.js versão 20 ou superior instalado. Você pode visitar o site oficial do Node.js para fazer o download e instalá-lo. Execute o seguinte comando para verificar a versão:

   node -v
   

2. armazém de clones
   Abra um terminal e execute o seguinte comando para clonar o projeto localmente:

   git clone https://github.com/cruzyjapan/Gemini-CLI-UI.git
   cd Gemini-CLI-UI
   

3. Instalação de dependências
   Execute o seguinte comando no diretório do projeto para instalar as dependências necessárias:

   npm install
   

4. Configuração de variáveis de ambiente
   O projeto precisa ser configurado .env Arquivo. Copie o arquivo .env.example Documentação:

   cp .env.example .env
   

   compilador .env adicione o arquivo Estúdio de IA do Google ou chave de API para o Vertex AI. Exemplo:

   GEMINI_API_KEY=your_api_key_here
   

   As chaves de API estão disponíveis no Google Estúdio de IA ou a plataforma Vertex AI para obtê-la. Certifique-se de que a chave seja segura e não pública.

5. Início dos serviços
   Após a conclusão da instalação, execute o seguinte comando para iniciar o servidor local:

   npm start
   

   Por padrão, o serviço é executado no diretório http://localhost:3000. Abra seu navegador e acesse este endereço para usá-lo.

6. autenticação de login
   No primeiro acesso, será solicitado que você faça login com sua conta do Google. Uma vez conectado, o Gemini-CLI-UI se conecta à CLI do Gemini e atribui automaticamente a sessão.geminicliui_auth.db) é usado para armazenar informações de autenticação para garantir a segurança.

Funções principais

1. interface de bate-papo ao vivo

• Descrição funcionalInteraja com a CLI do Gemini por meio da interface de bate-papo integrada para obter conselhos sobre codificação de IA ou responder a perguntas.
• procedimento::
  1. Depois de fazer o login, clique no botão "Chat" na parte superior da página para entrar na interface interativa.
  2. Digite uma pergunta na caixa de entrada, como, por exemplo, "Help me write a Python sort function.
  3. A CLI do Gemini retorna respostas em tempo real, suportando blocos de código, texto e referências de arquivo.
  4. Suporte ao upload de imagens: clique no botão de upload, selecione uma imagem e faça uma pergunta como, por exemplo, "Analyse the code in this image" (Analise o código nesta imagem).
  5. As sessões são salvas automaticamente e o histórico pode ser visualizado no Session Manager.

2. terminais integrados

• Descrição funcionalExecute comandos da CLI do Gemini diretamente de uma página da Web, sem um terminal local.
• procedimento::
  1. Clique na guia Terminal da página para abrir o shell incorporado.
  2. Digite o comando CLI do Gemini, por exemplo:

     gemini > Write a React component for a login form
     

  3. Os resultados são exibidos em um formato de streaming que permite a interação em tempo real.
  4. Use o modo YOLO (ativado em Setup) para ignorar os prompts de confirmação e acelerar a operação.

3. visualizador e edição de documentos

• Descrição funcionalNavegue pelos arquivos de projeto com suporte para edição ao vivo e realce de sintaxe.
• procedimento::
  1. Clique em "File Browser" (Navegador de arquivos) na barra de navegação à esquerda.
  2. Navegue pelo catálogo de projetos e clique em uma pasta para expandi-la/colapsá-la.
  3. Clicar no arquivo abre o editor CodeMirror, que oferece suporte ao realce de sintaxe para Python, JavaScript e outras linguagens.
  4. Após a edição, clique no botão "Save" (Salvar) e as alterações serão salvas em um arquivo local em tempo real.
  5. Suporte para criação, exclusão e renomeação de arquivos/pastas.

4. integração com o Git

• Descrição funcionalGerencie seus repositórios Git, visualize alterações, faça commit de código e alterne ramificações.
• procedimento::
  1. Clique na guia "Git Browser" para ver o status atual do seu repositório.
  2. Para visualizar as alterações não confirmadas, clique no botão "Staging" para adicionar um arquivo.
  3. Digite as informações do commit e clique no botão "Submit" (Enviar) para concluir o commit do Git.
  4. Alterne as ramificações ou crie novas ramificações nas opções de ramificação.
  5. Suporte para visualização dos últimos 7 dias do histórico de envios.

5. gerenciamento de sessões

• Descrição funcionalSalvar e retomar conversas com a CLI do Gemini e gerenciar várias sessões.
• procedimento::
  1. É possível visualizar todas as conversas históricas na tela de gerenciamento de conversas.
  2. Clique em uma sessão para retomar o diálogo e visualizar o registro de data e hora e os metadados.
  3. As sessões desnecessárias podem ser excluídas para liberar espaço de armazenamento.

advertência

• seguro .env esteja configurado corretamente; caso contrário, não será possível conectar-se à CLI do Gemini.
• O modo YOLO é adequado para usuários avançados; não há prompt de confirmação para a operação após a ativação; tenha cuidado.
• O projeto foi desenvolvido com o React 18 e o CodeMirror. Recomendamos o uso de navegadores modernos (por exemplo, Chrome, Firefox) para obter a melhor experiência.

cenário do aplicativo

1. Desenvolvimento móvel
   Os desenvolvedores podem acessar seus projetos, editar códigos ou executar comandos Git em qualquer lugar a partir de seus telefones celulares ou tablets usando a Gemini-CLI-UI, mantendo a continuidade do trabalho.
2. Trabalho em equipe
   Os membros da equipe compartilham projetos por meio da interface da Web, visualizam as alterações de código em tempo real e fazem commit em repositórios Git para uma colaboração mais eficiente.
3. Aprendizado e depuração
   Os iniciantes usam a interface de bate-papo para fazer perguntas sobre a CLI do Gemini, obter exemplos de código ou conselhos sobre depuração e aprender a programar rapidamente.
4. Prototipagem rápida
   Os desenvolvedores geram rapidamente estruturas de código por meio de comandos de terminal e incorporam recursos de edição de arquivos para ajustar o código e acelerar a criação de protótipos.

QA

1. É necessário instalar a CLI do Gemini?
   Sim, a Gemini-CLI-UI é a interface da Web para a CLI do Gemini. Você precisa instalar a CLI do Gemini e configurar a chave da API primeiro. Você precisa instalar o Gemini CLI e configurar a chave de API primeiro. Consulte a documentação oficial do Gemini CLI para obter o guia de instalação.
2. Quais linguagens de programação são compatíveis?
   O editor de arquivos oferece suporte ao realce de sintaxe em várias linguagens, incluindo Python, JavaScript, Java, C++ e outras, com a tecnologia CodeMirror.
3. Como faço para proteger minhas chaves de API?
   Não coloque .env Os arquivos são carregados em um repositório público. O Gemini-CLI-UI usa um banco de dados SQLite para armazenar informações de autenticação para armazenamento seguro.
4. Quais são os riscos do modelo YOLO?
   O modo YOLO ignora os avisos de confirmação, o que pode levar a uma operação incorreta (por exemplo, exclusão de arquivos). Recomenda-se ativá-lo somente para operações conhecidas.