Este é um projeto de um chatbot desenvolvido com Angular. Seu objetivo é fornecer uma interface de chatbot interativa integrada a diferentes serviços de backend, utilizando ChatGPT e Gemini.
- Interface de Chatbot
- Consumo da Gemini API
- Consumo da OpenAI API
- Formatação das respostas do LLM
A interface segue o padrão visual atual, bem como o comportamento padrão de uma estrutura de chat. Toda sua estilização e estruturação lógica e visual estão presentes no componente <app-chatbot></app-chatbot> para fins de simplificação do projeto.
Para consumir os serviços, foi criado o arquivo server.js compondo as lógicas necessárias de configuração e conexão, tanto com a API da OpenAI, quanto com a do Google Gemini.
Para iniciar o servidor de desenvolvimento, execute:
ng servePara executar o servidor express, execute no diretório do arquivo que contém a configuração de conexão com as API's: node nome-do-arquivo.js
Exemplo:
node server.jsFormatar as respostas é algo importante, haja vista que são retornadas em formato markdown, portanto, é necessário convertê-las em formato html. Para isso utilizamos a biblioteca marked, através do arquivo markdown.service.ts, que contém a lógica necessária para conversão do formato de texto, bem como retorno dos valores ao componente de exibição.
Vale ressaltar que deve-se, ainda, definir em um arquivo de estilo para cada tipo de estrutura do documento formatado. Nesse projeto os estilos foram definidos no arquivo styles.scss.
- "@google/generative-ai": "^0.13.0",
- "dotenv": "^16.4.5",
- "express": "^4.19.2",
- "marked": "^13.0.0",
- "openai": "^4.50.0",