How to Stream ChatGPT Output into Your App | Web Development with OpenAI Ep 3

Channel:

Akamai Developer

Subscribers:

1,040,000

Published on August 21, 2023 7:00:09 PM ● Video Link: https://www.youtube.com/watch?v=GkyHBwUA0EQ

Category:

Tutorial

Duration: 47:33

1,347 views

19

In this episode, @heyAustinGil dives into understanding web streams before implementing streaming responses from the OpenAI API. The result is a faster-perceived performance and a better user experience.

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 Welcome & Previous Video Recap
1:00 Teletype Prerequisites
2:58 Server-Side Logic without Route Actions
6:25 Build Out Stream
10:10 Intercept Form Submission
17:55 Error Explained!
18:30 Resolve Error
20:03 Add Logic to Readable Stream
21:45 Test Logic
23:00 Fix Logic Errors
23:20 Create Reactive State
26:30 Test App
26:45 Fix OpenAI Integration
29:00 Break Stream Down
30:50 Process Each Chunk of Data
32:22 Review Code
33:00 Test App and Review Console
34:35 RegEx Data Stream
36:34 Grab String
39:25 Test Again
39:40 Close String
40:10 Handle Payloads
42:35 Test App Again
43:30 Recap
45:30 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