How to Incorporate ChatGPT into Your App with Qwik.js | Developing Smarter Apps With Generative AI
129In this video, @heyAustinGil continues to build his versus app. Austin uses Qwik.js with JavaScript's fetch API to make an HTTP request to OpenAI's API. This allows for the integration of ChatGPT in Web Apps.
New to Cloud Computing? Get started here with a $100 credit → https://www.linode.com/lp/youtube-viewers/?ifso=linodetube&utm_source=youtube&utm_medium=SuperUser
Chapters:
0:00 Catch-Up
0:22 What We'll Be Doing
0:48 Generate OpenAI Secret Key
1:40 OpenAI Reference and Authentication
4:00 Make the Initial HTTP Request
6:50 Integrate Prototype Into App
9:30 Test Form
11:10 Update Fetch Request with Prefill
12:35 Test Form Again
12:40 Obscure the API Key
14:20 Use QwikCity Actions
19:00 Test Frontend
20:05 Update Routes
22:38 Test Form
23:02 Explore Response
24:00 Test Form Again
24:20 About the QwikOptimizer
26:01 Create Environment Variables
29:55 Restart Dev Server and Test
30:40 Styling Cleanup
31:30 Add OpenAI Response to Page
32:15 Test Form
33:27 Conclusion
Follow along with Austin's GitHub → https://github.com/AustinGil/versus
Check out Qwik.js docs→ https://qwik.builder.io/docs/
See OpenAI Docs → https://platform.openai.com/overview
Learn more about Fetch API → https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
Subscribe to get notified of new episodes as they come out → https://www.youtube.com/linode?sub_confirmation=1
#AkamaiDeveloper #openai #qwikjs #nodejs
Product: Akamai Developer, Open AI, Qwik.js, ChatGPT; @heyAustinGil