Chatbot from scratch with Next, AI SDK, OpenAI, and Shadcn/UI
ฝัง
- เผยแพร่เมื่อ 10 ก.ค. 2023
- 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
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.
Na minha opinião, você já pode trazer uma live de 20h mostrando esses outros conceitos mencionados, amém
Bom ver o diego consultando e tendo dúvidas como nós meros mortais, me identifico com vídeos assim
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
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
Maluco!!! Estou na espera desse projeto.
Muito massa. Mais assuntos de IA sim 🙌
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
Incrível!! Traz mais vídeos sobre o tema!
Que aula fodaaa! Parte 2 com certeza! Manda pra noisss
Que video insano Diegao parabens ai, conteudo top ein tras mais sobre SDK e IA para usuarios e para fazer codigos
Muito massa! Mais projectos com AI.
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.
Vlw pela dica dessa biblioteca de UI, achei bem legal ter algo assim para ganhar velocidade no desenvolvimento de novos projetos!
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.💜
Gosto muito esse tipo de conteúdo, inclusive estou em um projeto na minha empresa exatamente disso. Excelente encontrar mais material a respeito
Curti muito, parabens!!!
Essa nova UI resolveu um problema bem importante que eu estava tendo com o Radix. Muito obrigado por apresentar isso a mim, Diego!
Traz a continuação!!!!!!!! Ficou massa demais!
Muito top 🔥
Adoraria mais projetos sobre I.A. tanto aqui quanto na plataforma da rocket tb, talvez no ignite..
Muito massa!!
Projeto incrível, ver ele utilizando o System Message do ChatGPT seria maravilhoso e agregaria mais nele
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
Gostei muito dessa ideia, manda + desses tipos
Gostei. Agrega bastante este video
excelente, bora pra embeddings agora
Conteudo incrivel
Insano!
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.
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.?
essa lib é muito bom utilizo no meu trabalho e fica muito mais fácil de alterar os componentes da maneira que você quer usar
brabo!!
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.
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?
Traz mais vídeos incrementando esse app!
Muitoo boa essa aula, fui replicar, o chat n deixou, disse que eu tinha expirado meus consumos, mesmo eu nunca usando
Quero ver a continuação, respondendo a perguntas ligadas a uma plataforma.
Muito legal Diego ! E o projeto que vc fez em Python? Rolaria um vídeo ?! 😊
Tras sobre respostas voltadas a nossa própria plataforma, acho que ia ser muito massa 🙏🙏
Faz sobre o conteúdo da proporia aplicação, vai ficar massa!
Carac Diego por favor traz mesmo a continuação desse conteudo usando conteudo real de uma aplicação, nunca te pedi nada kkkkkkkkkkkkkkkkkk
ansioso para ver o que pega os dados da aplicação
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.
Traga mais, querido!
Top de mais, tenso é o susto quando o Diego abre uma tela sem o DarkMode kkkkkk
Traz video falando sobre IA lidando com o conteúdo da página!
Vídeo excelente. Diegão gostaria de assistir conteúdos de como treinar ias para responderem com base no nosso negócio
projeto muito legal ! vocês podiam fazer um dashboard em next js, com autenticação e etc...
UPUPUPUPUPUPUPUPUPUPUPUPUPUPUPUPUP
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
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?
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.
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 :/
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.
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.
Faz um vídeo com respostas relacionando em um conteúdo!
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!
Faz mais conteúdo sobre IA
Qual é o plugin de icons que vc utiliza. Gostei muito dele!
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 continuação do Jupiter ui 👀
top
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
estou tendo dificuldade em relação a o lib/utils de poder falar mais sobre isso seria incrivel
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?
Qual configuração vc usa no seu terminal?
estou tentando usar do huggingface mas apenas um modelo funcionou e é bem ruim , mas ja valeu a experiencia de implementar a sdk .
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
Por favor diegão, faz esse chatbot vai ajudar muitoo
Eu consigo criar este projeto utilziando React puro? Quais modificações eu teria que aplicar de forma geral?
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ê.
Como poderíamos adicionar uma parte de treinamento de IA baseado em pergunta/respostas prontas ou padrões baseados em processos mapeados via json?
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!)
Pow diegao mas assim é fácil, achei que tu ia usar um modelo de fato e criar um chat com ele.
Opaaa.. queria saber mais sobre a resposta relacionada ao conteúdo!! Ja ta aqui no canal?
Tem algum vídeo igual a esse só que fazendo aquela aplicação pra vídeo que você mostrou ?
qual tema ele ta usando no vs code?
Diego, eu consigo usar essa AI SDK da vercel num projeto que não seja Next? um Vite por exemplo.
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 😢
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
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?
@rocketseat Como conectar uma base de dados externa para servir de insumo nas respostas desse chatbot?
👍
oppa traga o chat bot com integração a aplicação vai ser top vlw
Que extensão vc usa pra realizar essas pesquisas sem precisar abrir o navegador do Google ?
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?
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
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
A rocketseat podia liberar um curso vitalício dnv
Diego não é bom em css grid? não é possível, :-(
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.
Como faço para pegar uma consultoria com vocé?
Seria interessante essa parte de IA, nao tem quase nenhum canal ensinando isso, e quando ensina, fica de forma muito abstrata
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.
como conseguiu acesso a esse navegador?? queria poder usar tb
27:44 kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk
Por favor, explica como deixar o tamanho da imagem responsiva no next js 13.4. tá sendo uma tortura kkk
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 realmente queria saber como criar uma estilo jarvan