Chatbot from scratch with Next, AI SDK, OpenAI, and Shadcn/UI
Вставка
- Опубліковано 11 вер 2024
- Diego decided to venture into AI development once again. 👀
The challenge is always to transform the user experience, delivering the best a application can offer.
In this video, we'll create a Chatbot from scratch using Next, the OpenAI AI responsible for the development of ChatGPT and other GPT models, and we'll get to know AI SDK, which is Vercel's model.
So, let's code?
Don't forget to leave your questions about artificial intelligence in the comments with the hashtag #PR 😎
Follow Rocketseat on social media:
Twitter: @rocketseat
Facebook: @rocketseat
Instagram: @rocketseat
![Micro-SaaS na Prática: Setup com Next.js 14, Shadcn UI e Autenticação com Next Auth [+ Bônus]](/img/n.gif)
Seria legal um NLW com AI
Seria ótimo, para podermos aprofundar mais afundo o conhecimento AI
Sim boa ideia
Eu estou desenvolvendo um site e eu preciso dessas funcionalidades...
JavaScript Mastery
Apoio hehe
Que projetinho massa! Ansioso por uma NLW com a temática de AI.
Uma ideia: Usar a IA para resumir as mensagens recebidas no dia. Isso seria útil para aquela gente que quase não tem tempo para os email ou mensagens dos grupos do WhatsApp. A aplicação basicamente faria um resumo das conversas e iria filtrar as mensagens mais relevantes como, um aniversário, uma infelicidade, um evento marcado, coisas do género. Seria um assistente bastante útil.
Maneiro demais
A biblioteca ShadCN/UI é incrível ! Parabéns por mais um vídeo incrível !!
acho que só passare a usar essa
Tem o Mantine UI, que tem mais feature que o ShadCN.
@@newerton Fui pesquisar sobre esse Mantine Ui e de fato é muito bom mesmo
Bom ver o diego consultando e tendo dúvidas como nós meros mortais, me identifico com vídeos assim
Na minha opinião, você já pode trazer uma live de 20h mostrando esses outros conceitos mencionados, amém
Gosto muito esse tipo de conteúdo, inclusive estou em um projeto na minha empresa exatamente disso. Excelente encontrar mais material a respeito
Será ótimo ter conteúdo cada dia mais relacionado a IA, ao ser muito útil qualquer conteúdo sobre esse assunto. Obrigado por está sempre trazendo educação para toda a comunidade. Isso é honroso.
Adoraria mais projetos sobre I.A. tanto aqui quanto na plataforma da rocket tb, talvez no ignite..
Senhor que incrível iniciativa, sempre na frente de todo mundo pqp. Muito legal mostrar pra nós de como ensinar as IA pra satisfazerem a necessidade do nosso negócio, se tem como ensinar pra elas nossos processos pra ela ajudar a responder novos usuário interessados ou sei lá. Agradecido
Otimo video, Diego! Se me permite, galera, estamos ciando um projeto open source muito alinhado a esse apresentado no video! Lá no canal a gente cria uma aplicacao que vai um passo alem do chatbot que te permite administrar os agentes e acessá-los no VSCode. Abraços!
No momento está em ingles e é uma breve apresentaçao, mas mais noticias só entrar nos links
Muito massa. Mais assuntos de IA sim 🙌
Seria possível aprimorar esse projeto com uma IA customizada? Para criar chatbot em site empresarial
up
Eu acho que isso é resolvido montando a base de dados da empresa pra ele consumir. Em suma, acho que seria bom pra todo mundo um vídeo assim.
Essa nova UI resolveu um problema bem importante que eu estava tendo com o Radix. Muito obrigado por apresentar isso a mim, Diego!
Muito de orgulho de vocês e esperança pela transformação de que esse tipo de conteúdo trará para educação principalmente do nosso país, com essa metodologia incrível e inspiradora.💜
projeto muito legal ! vocês podiam fazer um dashboard em next js, com autenticação e etc...
UPUPUPUPUPUPUPUPUPUPUPUPUPUPUPUPUP
Como treinar uma IA para dar dicas técnicas com base no código específico de um projeto? As dicas poderiam ser desde melhoria de código com base nos padrões da indústria até coisas de arquitetura.
Ae, me ajudou bastante, estava precisando criar um para um chat interno aqui na empresa e o vídeo com as bibliotecas auxiliaram bastante. Valeu Diego
Muitoo boa essa aula, fui replicar, o chat n deixou, disse que eu tinha expirado meus consumos, mesmo eu nunca usando
Eu gostaria exactamente que o chat respondesse apenas perguntas relacionadas a aplicação. Eu tô trabalhando numa aplicação web de saúde mental e tem uma sessão que seria basicamente terapia com uma ia. É para um projecto da escola, então seu conhecimento sobre IAs será muito útil para o projecto.
Projeto incrível, ver ele utilizando o System Message do ChatGPT seria maravilhoso e agregaria mais nele
Muito top a aula, você poderia fazer um exemplo com integração ao banco de dados da aplicação, buscando informações ou salvando informações, seria bem top e mais parecido com uma aplicação real.
Que massa!!
Diego, vc pode falar mais sobre como fazer a AI se comportar com o contexto da plataforma/aplicação?
Já deixei de pegar muitos freelas de gente pedindo chat AI humanizado por conta de não saber como deixar apenas no contexto da plataforma do cliente.
Carac Diego por favor traz mesmo a continuação desse conteudo usando conteudo real de uma aplicação, nunca te pedi nada kkkkkkkkkkkkkkkkkk
Vlw pela dica dessa biblioteca de UI, achei bem legal ter algo assim para ganhar velocidade no desenvolvimento de novos projetos!
Cara POR FAVOR fala mais de todos esses termos lí que você comentou, principalmente nesse início de vídeo, tem muito ouro escondido aí e eu não faço ideia de por onde começar.
Que video insano Diegao parabens ai, conteudo top ein tras mais sobre SDK e IA para usuarios e para fazer codigos
Maluco!!! Estou na espera desse projeto.
Top de mais, tenso é o susto quando o Diego abre uma tela sem o DarkMode kkkkkk
Tras sobre respostas voltadas a nossa própria plataforma, acho que ia ser muito massa 🙏🙏
Que aula fodaaa! Parte 2 com certeza! Manda pra noisss
Curti muito, parabens!!!
essa lib é muito bom utilizo no meu trabalho e fica muito mais fácil de alterar os componentes da maneira que você quer usar
Salve Diego, como ficaria a integração da api do Whatsapp com a api da OpenAI? Seria legal ver essas duas tecnologias integradas. Valeu!! #PR
vc pode usar o Twilio, pra usar o whatsapp, uma das opções
Traz video falando sobre IA lidando com o conteúdo da página!
Incrível!! Traz mais vídeos sobre o tema!
Cara, muito legal! Ficou incrível. Será q consigo a partir disso q vc ensinou criar algum tipo de autenticação para poder compartilhar isso com alguns amigos, parentes etc.?
18:05 é o auge do Diego sendo o Diego. Mó silêncio... "Tá mó feio, né, cara?" (31:50 tem o brilho dele indo embora também!)
Gostei muito dessa ideia, manda + desses tipos
27:44 Essa é a melhor reação do Diego que eu já vi kkkkkkkkkkkkkkkkkkkkkkkkkk
A partir desse trecho as reações do Diego são muito divertidas, claramente o cara se diverte codando, é disso que eu gosto, realmente muito bom. Vlw Rocketseat/Diego pelo conteúdo, ótimo como sempre.
Muito massa! Mais projectos com AI.
Dahora, me ajudou muito. Mas como eu poderia fazer para colocar uma label com a data e hora de cada mensagem? estou fazendo um chatbot que guarda as mensagens em um banco de dados mongodb, com data e hora, mas não sei como mostrar esse horário no frontend :/
Traz a continuação!!!!!!!! Ficou massa demais!
Muito legal Diego ! E o projeto que vc fez em Python? Rolaria um vídeo ?! 😊
Quero ver a continuação, respondendo a perguntas ligadas a uma plataforma.
Essa é exatamente a minha dúvida como fazer o chatgpt responder com base nos conteúdos da minha plataforma, adoraria ver um conteúdo que falasse sobre isso,
Faz sobre o conteúdo da proporia aplicação, vai ficar massa!
estou tendo dificuldade em relação a o lib/utils de poder falar mais sobre isso seria incrivel
Ensina a gente como criar esse chatbot consumindo dados de um banco de dados e uma base de dados como uma documentação... muito bom.... obrigado pelo conteúdo!
ansioso para ver o que pega os dados da aplicação
excelente, bora pra embeddings agora
Um tempo atrás ei tentei fazer um projeto de gerar por AI perguntas e 4 alternativas de respostas pra ajudar a estudar. Na teoria funcionava perfeito tinha um input q fazia a requisição pra API e por baixo dos panos eu especificava pra AI q a resposta e as perguntas deviam ser separadas por / depois pegava a response e dava um slice pra separar em uma array e organizar nos radios. Mas eu sempre recebia que tinha excedido meu limite de requisições mesmo no usage da openai aparecer 0 de 18 dólares usados 😢
Vídeo excelente. Diegão gostaria de assistir conteúdos de como treinar ias para responderem com base no nosso negócio
Seria interessante essa parte de IA, nao tem quase nenhum canal ensinando isso, e quando ensina, fica de forma muito abstrata
Diego, podemos pegar um vídeo, usar AI para convertir em audio segmentando por 1 minuto (repetir 5 vezes) e extrair o texto desse áudio para fazer um site para ensinar idiomas
Salve Diego, beleza mano?
Tenho uma dúvida, como posso melhorar o desempenho e a velocidade da minha aplicação de IA? Quais estratégias de otimização posso usar para garantir um processamento mais eficiente?
Muito top 🔥
mais um excelente conteúdo! parabéns! queria saber como fazer um chat bot que tenha respostas pré-definidas relacionadas a perguntas por palavras chaves, definindo-as em um excel. é recomendado programar esse tipo de funcionalidade? ou há formas melhores de fazer isso?
Eu consigo criar este projeto utilziando React puro? Quais modificações eu teria que aplicar de forma geral?
Opaaa.. queria saber mais sobre a resposta relacionada ao conteúdo!! Ja ta aqui no canal?
Traz mais vídeos incrementando esse app!
Traga mais, querido!
estou tentando usar do huggingface mas apenas um modelo funcionou e é bem ruim , mas ja valeu a experiencia de implementar a sdk .
Pow diegao mas assim é fácil, achei que tu ia usar um modelo de fato e criar um chat com ele.
Muito massa!!
Gostei. Agrega bastante este video
Faz um vídeo com respostas relacionando em um conteúdo!
Como poderíamos adicionar uma parte de treinamento de IA baseado em pergunta/respostas prontas ou padrões baseados em processos mapeados via json?
Conteudo incrivel
Faz continuação do Jupiter ui 👀
Fala Diegão! O que acha de fazer um curso mais completo para implementação de algumas soluções de IA em uma aplicação web?
Alguém teve problema com a chave da OpenAi? Apesar de utilizar um email novo e copiando diretamente da página, o request retorna erro de chave inválida. :/ Tentei criar outra e testei em duas contas diferentes, uma dela criei na hora com email diferente.
Tenho uma duvida. Tenho uma aplicação e uma documentação para o usuário, com ajuda, como usar a aplicação, um FAQ. Como eu posso ensinar o Chat sobre essa documentação e deixar que o usuário pergunte a AI e responda com conhecimento da documentação e nada mais?
qual tema ele ta usando no vs code?
Fica minha pergunta para o PR:
Como evitar que os modelos presentes hoje treinem com os dados de sua empresa e suas regras de negócio se eles estão linkados com seu produto?
A rocketseat podia liberar um curso vitalício dnv
Faz mais conteúdo sobre IA
brabo!!
Qual é o plugin de icons que vc utiliza. Gostei muito dele!
Insano!
Que extensão vc usa pra realizar essas pesquisas sem precisar abrir o navegador do Google ?
Bom dia, estou procurando um curso estilo full hack de IA, procurei na rockeat seat mas não tem ainda, só tenho garimpado na net informações, mas não tenho muito tempo livre, gosto muito do seu estilo de aulas, principalmente das dicas de melhores frameworks e bibliotecas suas, sugere algum curso , ou link de preferencia com você.
Diegão, eu tenho uma dúvida, como posso fazer esse mesmo chatbot só que em bot para discord? tipo criar meu próprio bot AI, da pra trazer esse conteúdo ? eu queria fazer um assim pra estudo, muito mais fácil do que usar navegador.
E obrigado pelo conteúdo
Qual configuração vc usa no seu terminal?
Cara eu to com uma duvida, eu queria comecar um projeto desse de chat bot, mas eu tava com muita duvida sobre onde achar a API, a minha duvida é, nao da pra usar essa sdk com Angular? tem alguma outra opcoes de api ou sdk, eu nao sei a diferenca, so que pra angular, eu sei que o conteudo da rockeaset nao e focada em Angular, mas independentemente aqui e um otimo lugar pra tirar duvidas, ou ate mesmo aprender coisas novas
Fala diegao, como eu posso usar a IA para detectar as medidas do pé de um usuário com um app construído em react native e se possível gerar um forma 3d com essas medidas para ser impresso em um impressora 3d
@rocketseat Como conectar uma base de dados externa para servir de insumo nas respostas desse chatbot?
Mais alguém teve problemas com as estilizações de algum dos componentes? comigo o componente avatar não aplica as estilizações e traz as imagens no tamanho original
Tem algum vídeo igual a esse só que fazendo aquela aplicação pra vídeo que você mostrou ?
Fiz o tutorial e mesmo inserinfo perguntas a api não respode, eu preciso pagar pra isso ou não ?
27:44 kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk
Por favor diegão, faz esse chatbot vai ajudar muitoo
Como faço para pegar uma consultoria com vocé?
Eu tenho um app em expo e queria enviar dados para a ia analisar e dar dicas sobre o conteúdo enviado. Coko faço isso em expo e ts
Eu queria utilizar a Ai para e-commerce, mas creio que não é viável pelo preço e gostaria de usar meu banco de dados e existe no git explicando isso mas tem algo errado ou eu estou errado?
top
Por favor, explica como deixar o tamanho da imagem responsiva no next js 13.4. tá sendo uma tortura kkk
oppa traga o chat bot com integração a aplicação vai ser top vlw
Qual terminal é esse? Achei muito melhor que o terminal padrão do macos
além disso, ao enviar a pergunta, o navegador não retornou a resposta do chat e o vs code apresentou esse erro: error unhandledRejection: Error: Response error: {
"error": {
"message": "You exceeded your current quota, please check your plan and billing details.",
"type": "insufficient_quota",
"param": null,
"code": "insufficient_quota"
}
}
é devido ao não usar o plano pago? tem como testar esse no plano gratuito?
O meu deu o mesmo problema, conseguiu resolver? tbm to achando que é por não ser pago
@@LeoTomio não consegui não