Este é um projeto de chatbot simples e interativo construído com HTML, CSS e JavaScript puro, que utiliza a API do Gemini para fornecer respostas inteligentes. O nome nIAh (ou o que você preferir!) representa uma assistente de IA moderna e útil. Aqui esta um vídeo com a aplicação em uso: https://youtu.be/vdjNlg-rQjY
- Integração com a API do Google Gemini: Comunicação direta para respostas avançadas e contextuais.
- Histórico de Conversa Persistente: Salva automaticamente as perguntas e respostas no
localStoragedo navegador, mantendo o contexto da conversa mesmo após o recarregamento. - Modo Escuro (Dark Mode): Alterna o esquema de cores para uma melhor experiência visual, especialmente à noite, com persistência da preferência no
localStorage. - Botão "Copiar" na Resposta: Facilita a cópia rápida do conteúdo gerado pela IA.
- Limpar Chat: Um botão dedicado para apagar todo o histórico de conversa (
localStoragee interface). - Alerta de Chave de API: Validação básica da chave de API inserida pelo usuário.
- Formatação de Respostas: Utiliza a biblioteca
marked.jspara renderizar a formatação Markdown (**negrito**,*itálico*, etc.) das respostas da API.
Como este é um projeto de front-end puro, você só precisa de um navegador para executá-lo.
- Clone o Repositório (Assumindo que este código está em um repositório):
git clone [LINK-DO-SEU-REPOSITORIO] cd [NOME-DO-PROJETO] - Abra o
index.html: Basta clicar duas vezes no arquivoindex.htmlou abri-lo em seu navegador preferido.
Para que o chatbot funcione, você precisará de uma Chave de API do Google AI Studio (ou Gemini API).
- Obtenha sua Chave: Crie sua chave no Google AI Studio.
- Insira no Chatbot: Na interface do chatbot, haverá um campo onde você deve inserir sua chave de API antes de enviar sua primeira mensagem.
- Modelo Utilizado: O código está configurado para usar o modelo
gemini-2.0-flash.
O código JavaScript principal gerencia as seguintes funcionalidades:
| Variável/Função | Descrição |
|---|---|
responses, questions |
Arrays para armazenar e persistir o histórico de conversas no localStorage. |
addMessage(text, sender) |
Cria e adiciona uma nova mensagem ao chat-box, formatando a resposta do bot com marked.js. |
showAlert(message) |
Exibe uma pequena notificação de alerta (usada para chaves inválidas). |
getResponseFromApi(message) |
Função assíncrona que envia a mensagem do usuário para o endpoint da API do Gemini, tratando o estado de "Digitando" (loading) e erros. |
darkModeToggle |
Gerencia a alternância e persistência (localStorage) do modo escuro. |
clearChatButton |
Limpa o chatBox e o localStorage, reiniciando a conversa. |
Sinta-se à vontade para sugerir melhorias, reportar bugs ou adicionar novos recursos!
- Faça um Fork do projeto.
- Crie uma Branch para sua feature (
git checkout -b feature/minha-feature). - Faça o Commit das suas mudanças (
git commit -m 'feat: Adiciona feature XYZ'). - Envie para o seu Fork (
git push origin feature/minha-feature). - Abra um Pull Request.