How to Build an AI Assistant using NextJS (Vercel)

Рет қаралды 2,756

Күн бұрын

Throughout this in-depth tutorial, we’ll learn how to build a research paper summariser using OpenAI's Assistants API. The summariser takes in a document as form data and returns a summary of the document as the response.
I will walk you through handling file data, form submissions, and responses from the API. We’ll also learn some of the limitations of the current version of the API.
If you are looking to learn more about integrating AI into your own web development project, then this is the perfect video for you!
00:00 Introduction and Overview
00:02 Building a Research Paper Summariser
00:37 Understanding AI Assistants
00:51 Exploring AI Packages
01:38 Creating an AI Assistant
02:43 Demonstrating the Research Paper Summariser
03:05 Understanding Limitations of the OpenAI Assistants API
04:42 Setting Up the Project
07:00 Exploring the Project Structure
07:59 Building the Route Handler
18:43 Creating the UI
20:15 Setting Up the Status and File Input
20:35 Building the Page Layout
20:47 Adding Styles and Creating the Container
21:17 Creating Error and Loading Components
21:57 Building the Form
22:50 Adding Input and Button Elements
23:57 Adding File Input and Button
25:11 Creating Event Handlers
26:54 Handling Form Submission
32:25 Testing the Form Submission
34:47 Displaying the Messages
37:31 Final Thoughts and Conclusion
🔑 Key Takeaways
- Introduction to OpenAI API Dashboard
- How to integrate with OpenAI's Assistants API
- Handling File Submission
- Creating NextJS Forms w/ Route Handlers
- Dealing with AI Server Response in the UI
🔗 Resources
Source Code: github.com/taylor-lindores-re...
OpenAI: platform.openai.com/
Vercel AI: sdk.vercel.ai/docs
Assistants API: platform.openai.com/assistants
Vercel useAssistant Hook: github.com/vercel/ai/tree/mai...
#webdevelopment #javascript #code #ai #chatgpt

Пікірлер: 16

@dailywisdomquotes518 5 ай бұрын

could you add function calling for above code

@user-ir1ue6yv3y 7 ай бұрын

That's a very nice tutorial, thank you very much. However, I am struggling with a problem - I cloned your repo and when I try to send any message (with or without a file) I get this error: Error: Error: Failed to parse stream string. Invalid code body{display. By the way - what is SITE_URL in .env file for? It seems assistant needs only openai api key and assistant id?

@taylorlindoresreeves 7 ай бұрын

SITE_URL should just be your localhost. I’m not entirely sure it’s necessary from memory. With regards to the error message, have you added but the prompt as well as the file?

@rabihdaoud8629 5 ай бұрын

@@taylorlindoresreeves I do have the SITE_URL but I am running into the same issue as @user-ir1ue6yv3y

@13furlan 2 ай бұрын

some problem here. I think was a bug in cors

@karamguliyev7803 Ай бұрын

Hey, I have noticed your code shows source in every paragraph. But I couldn’t understand how you managed to do that. Would you explain it to me or tell me when did you code that part?

@taylorlindoresreeves Ай бұрын

I think it’s VSCode extension called GitLens 👍

@ShaneCrenshaw Ай бұрын

Do you have an updated version by any chance for Vercel's latest versions?

@taylorlindoresreeves Ай бұрын

Yeah I do, I’m just re-publishing. I forgot to add the intro to the final edit. Will be released in 1-2 hours. I think it’s the best video I’ve done. Hope you like it.

@rabihdaoud8629 4 ай бұрын

Amazing tutorial. Can you do one with function calling??

@taylorlindoresreeves 2 ай бұрын

Absolutely, great idea, I've noted it down - lots of developments in the function calling API recently so it's a good time to do a tutorial. I will create this in the coming weeks. Please subscribe if you haven't already to make sure you're notified.

@taylorlindoresreeves Ай бұрын

Just released this tutorial - check my latest vid 👀Hope you like it!

@nicolaspavon664 2 ай бұрын

Hi! is there a way to switch assistants?

@taylorlindoresreeves 2 ай бұрын

You basically create the assistant. The assistants API has been updated significantly since I made this video. I will make another on the latest version (v2) and function calling.

@dailywisdomquotes518 5 ай бұрын

the code not running, just i wasted some time