WEBVTT 00:00.620 --> 00:05.360 그라디오의 날 유피터랩에 잘 오셨습니다 어디까지 했는지 기억하실 거예요 00:05.360 --> 00:14.990 두 개의 사용자 인터페이스를 작성했는데 하나는 GPT 4와 기능상 채팅용이었고 하나는 00:14.990 --> 00:19.460 함수용 클로드와 채팅용이었죠 00:19.580 --> 00:21.980 이제 여러분께 묻죠. TUT D. 00:22.010 --> 00:25.310 이런 함수를 썼다고 가정해 보죠 00:25.310 --> 00:28.160 이 함수는 복합 함수예요 00:28.160 --> 00:32.330 스트림 모델이라고 하는 함수로 다른 이들을 호출하죠 00:32.330 --> 00:40.040 프롬프트와 모델을 취하고 모델이 GPT라면 스트리밍 GPT를 호출하죠 00:40.370 --> 00:42.530 클로드라면 개울이라고 하죠 00:42.530 --> 00:44.420 안 그러면 클로드가 실수를 하죠 00:44.420 --> 00:46.130 GPT나 클로드가 돼야 해요 00:46.130 --> 00:51.140 그러면 순환하면서 한 덩어리를 한 번에 수확해요 00:51.140 --> 00:53.420 함수라고 불렀지만 사실은 아니죠 00:53.420 --> 00:54.440 발전기예요 00:54.590 --> 01:01.970 어떤 모델로 부르느냐에 따라 다른 모델에서 덩어리가 나와요 01:02.000 --> 01:03.500 잘 작동할 거예요 01:03.530 --> 01:07.730 변수가 몇 가지 더 있는 함수가 됐죠 01:07.730 --> 01:12.140 그러니 그라디오에게 그건 또 다른 함수일 뿐이죠 01:12.140 --> 01:16.490 그 함수를 중심으로 사용자 인터페이스를 쉽게 만들 수 있다는 거죠 01:16.490 --> 01:17.660 한번 보죠 01:17.690 --> 01:18.800 여기 있네요 01:18.800 --> 01:20.450 인터페이스예요 01:20.480 --> 01:26.840 이 함수는 우리가 방금 입력한 하이브리드 생성기예요 01:26.840 --> 01:29.000 물론 입력값은 2개죠 01:29.000 --> 01:30.890 그중 하나는 메시지예요 01:30.890 --> 01:34.010 다른 사람들은 이렇게 쉬우면 좋겠어요 01:34.040 --> 01:39.230 두 개의 값을 불러오는 거죠 GPT나 Clude Label SELECT 모델로요 01:39.230 --> 01:41.990 그런 다음 그걸 출력으로 하는 거죠 01:42.470 --> 01:44.630 하지만 그렇게 쉬운 일은 드물죠 01:44.660 --> 01:47.600 여긴 그라디오라서 모든 게 정말 쉬워요 01:47.690 --> 01:50.240 죄송해요, 이것부터 확인할게요 01:50.480 --> 01:51.320 됐어요 01:51.320 --> 01:52.100 그렇게 간단하지 않아요 01:52.130 --> 01:54.110 여전히 모든 코드를 실행해야 해요 01:54.290 --> 01:56.390 자, 시작하죠 01:56.390 --> 02:05.750 Get up, 예를 들어 타임스스퀘어에서 그랜드 센트럴까지 어떻게 가죠? 02:06.210 --> 02:08.160 모델 중 한 명을 선택해요 02:08.160 --> 02:12.600 GPT를 선택해 제출하면 마크다운에서 스트리밍되죠 02:12.600 --> 02:17.310 방향 문제에 대한 GPT의 반응이죠 02:17.610 --> 02:19.230 즐거운 시간 보내세요 02:19.260 --> 02:20.190 아주 좋아요 02:20.310 --> 02:23.760 이번에는 선택지가 더 많아진 것 같지만 어쩔 수 없죠 02:23.790 --> 02:24.480 아닐지도 모르죠 02:24.600 --> 02:25.710 기억날 거예요 02:25.980 --> 02:29.640 클로드를 보고 같은 질문을 하면 돼요 02:29.640 --> 02:32.490 똑같은 질문에 대한 클로드의 대답이에요 02:32.640 --> 02:34.260 클로드 하이쿠를 써서요 02:34.290 --> 02:37.950 그래서 대답이 짧고 간결해진 것 같아요 02:37.950 --> 02:40.230 정말 놀랍지 않아요? 02:40.230 --> 02:40.890 멋지죠? 02:40.890 --> 02:42.300 이 기능성만 빌드했죠 02:42.330 --> 02:46.470 두 모델 사이를 넘나들면서 같은 질문을 하면 답이 나오죠 Get it 02:46.560 --> 02:51.810 그냥 실행시킬 수도 있어요 멋진 채팅 UI를 원하시면요 다양한 02:51.810 --> 02:53.610 모델로 튕길 수 있죠 02:53.670 --> 02:55.710 유용한 도구죠 02:56.820 --> 03:04.050 그리고 여러분이 상상할 수 있는 명백한 훈련이 하나 더 있어요 여기에 제미니를 추가하는 03:04.050 --> 03:05.160 거죠 03:05.160 --> 03:05.670 왜요? 03:05.700 --> 03:06.450 상상이 되시죠? 03:06.450 --> 03:07.230 아주 쉬워요 03:07.230 --> 03:08.070 그냥 추가하는 거죠 03:08.070 --> 03:09.470 제미니를 선택해도 되고요 03:09.470 --> 03:15.680 제미니 강의에서 스트림하는 법을 보여드린 적은 없지만 아주 비슷해요 구글로 빠르게 검색하면 03:15.680 --> 03:20.900 아주 명확한 문서화가 있고 그걸 추가해서 그 코드를 푸시해 제가 갖고 다른 학생들과 03:20.900 --> 03:22.820 공유할 수 있죠 03:22.820 --> 03:23.810 그럼 좋죠 03:24.770 --> 03:25.700 좋아요 03:25.700 --> 03:30.230 이 실험실의 마지막은 괜찮을 거예요 03:30.230 --> 03:35.810 지난번에 만든 회사 브로슈어 생성기를 가져다 사용자 인터페이스를 적용해 보죠. 03:35.840 --> 03:37.070 그럼 정말 멋지겠죠? 03:37.250 --> 03:41.750 이제 아셨으니 말씀드렸듯이 아주 간단할 거예요 03:41.750 --> 03:44.660 그래서 전 그 책자의 초기 버전을 선택했어요 03:44.660 --> 03:48.200 랜딩 페이지만 사용할 거예요 03:48.200 --> 03:52.850 모든 링크를 모으는 2단계 프로세스는 하지 않겠습니다 지금 필요한 것보다 03:52.850 --> 03:54.350 더 복잡할 수 있으니까요 03:54.440 --> 04:00.050 URL과 제목, 텍스트를 가진 웹사이트 클래스의 간단한 버전을 보여드릴게요 어떻게 04:00.050 --> 04:02.210 작동하는지 기억하실 거예요 04:02.210 --> 04:07.520 요청 패키지를 사용하고 뷰티풀 get을 이용해 관심 없는 04:07.520 --> 04:10.160 걸 걸러내고 텍스트를 얻죠 04:10.160 --> 04:18.070 getcontext 도우미가 있어요 일종의 getcontent 도우미로 페이지 제목과 04:18.070 --> 04:19.840 본문을 제공하죠 04:19.840 --> 04:21.160 도우미 수업은 여기까지고요 04:21.190 --> 04:22.180 실행하는 거 잊지 마요 04:22.210 --> 04:23.170 시스템 프롬프트예요 04:23.170 --> 04:27.310 회사 웹사이트의 내용을 분석하고 랜딩 페이지에 짧은 답변을 작성하는 04:27.310 --> 04:28.750 시스템에 있죠 04:28.750 --> 04:31.180 마크다운에는 시스템 프롬프트가 있어요 04:31.180 --> 04:41.350 스트림 브로슈어 함수가 있어요 회사 이름, URL 그리고 모델을 취하죠 04:42.160 --> 04:46.510 회사명을 위한 회사 안내 책자를 생성해 달라고 하네요 04:46.510 --> 04:48.250 이게 랜딩 페이지예요 04:48.250 --> 04:54.370 그런 다음 웹사이트 도우미 클래스를 이용해 해당 URL을 읽고 내용을 get 하죠 04:54.370 --> 04:56.140 이제 이해가 되네요 04:56.140 --> 04:59.230 웹 사이트의 내용을 get 할 거예요 04:59.230 --> 05:00.790 그걸 프롬프트로 바꿀게요 05:00.790 --> 05:04.330 GPT라면 GPT에서 스트림할 거예요 05:04.360 --> 05:06.640 클로드면 클로드에서 물을 퍼내야죠 05:06.850 --> 05:14.280 안 그러면 에러가 발생해서 발전기를 만들게 되고 결과물이 한 덩어리씩 나올 05:14.280 --> 05:15.510 거예요 05:16.830 --> 05:23.340 비트라고 부르는 게 오해의 소지가 있는 것 같아요 사실 비트 한 덩어리씩이 아니거든요 05:23.370 --> 05:25.560 총액이에요 05:25.590 --> 05:31.260 이름을 바꾸는 게 좋겠어요 이 상황을 더 잘 반영하는 이름으로요 05:32.160 --> 05:33.810 Get you, I'm get you, I'm get you, I'm get it, I'm it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get it, I'm get'm get, I'm get'm get, I'm get. 05:33.840 --> 05:36.030 이거면 될 거예요 05:36.420 --> 05:37.770 그럼 좋지 않을까요? 05:37.770 --> 05:39.420 Get it이라고 하면 질릴 테니 그만할게요 05:39.450 --> 05:40.470 하지만 좋아요 05:40.470 --> 05:45.090 함수를 스트림 브로슈어로 대체하는 것만큼 간단해요 05:45.090 --> 05:46.560 여기 입력값이 보이시죠 05:46.560 --> 05:48.570 물론 세 가지 입력값이 있죠 05:48.600 --> 05:49.800 회사 이름이 생겼네요 05:49.800 --> 05:51.420 랜딩 페이지 URL이 있어요 05:51.420 --> 05:53.490 그런 다음 모델을 고르죠 05:53.610 --> 05:56.520 한번 해 보죠 05:56.970 --> 05:58.170 여기 있네요 05:58.170 --> 05:59.190 현지에서 운영되죠 05:59.190 --> 06:03.960 회사명 포옹 얼굴이라고 할 수 있게 띄워 주세요 06:06.240 --> 06:09.510 랜딩 페이지 URL도 말할 수 있죠 06:09.750 --> 06:10.830 이렇게 하죠 06:13.740 --> 06:19.040 안아주기요 co와 select 모델을 선택하세요 06:19.040 --> 06:26.240 GPT에 먼저 추가하고 제출을 누르라고 요청할 거예요 06:26.420 --> 06:27.920 이제 시작이네요 06:27.920 --> 06:34.280 이건 회사 안내 책자예요 헐깅페이스 스트리밍을 마크다운으로 하는 거죠 웹 스크래프를 기반으로요 06:34.280 --> 06:35.540 다 있어요 06:35.540 --> 06:39.680 심지어 아래쪽에 다양한 용도의 링크가 있어요 06:39.770 --> 06:43.220 네, 링크가 맞는 것 같네요 06:43.220 --> 06:44.270 이거면 되겠어요 06:44.270 --> 06:49.700 몇몇 링크들은 작동하지 않을 것 같습니다 생성된 방식 때문에요 06:49.700 --> 06:53.900 그래도 웹페이지는 정말 인상적이에요 브로슈어도 인상적이고요 06:53.900 --> 06:55.610 정말 좋아요 06:55.640 --> 06:58.520 클로드가 클로드 하이쿠로 뭘 하는지 보죠 06:58.550 --> 06:59.060 물론이죠 06:59.060 --> 07:05.120 좀 더 날씬하지만 이 정도면 괜찮아요 07:05.120 --> 07:07.190 함께 인공지능의 미래를 만들어 나가요 07:07.280 --> 07:11.150 하이쿠 책자가 아주 좋네요 07:11.570 --> 07:13.880 이제 됐어요 07:13.910 --> 07:14.840 네 07:14.840 --> 07:21.400 그러디오를 쓸 때마다 정말 놀라워요 얼마나 단순하고 효과적인지 말이에요 07:21.400 --> 07:27.250 책자 주위에 사용자 인터페이스를 구축했어요 다른 모델 사이에서 고를 수 07:27.250 --> 07:29.650 있죠 인정합시다, 쉬웠어요 07:29.860 --> 07:33.880 이 상황을 개선할 방법은 아주 많아요 07:33.940 --> 07:38.260 앞서 언급한 제미니를 추가할 수도 있고 이 예제에도 추가할 수 있어요 07:38.410 --> 07:47.050 다른 아이디어는 다른 드롭다운을 추가하는 거예요 스타일이나 톤을 고를 수 있는 드롭다운요 07:47.050 --> 07:52.240 시스템 프롬프트도 쉽게 바꿀 수 있죠 브로슈어가 익살스럽고 07:52.240 --> 07:55.540 농담조로 유쾌하게요 07:55.840 --> 08:00.940 저 드롭다운에서 고를 수 있도록 설정해 볼까요? 다른 톤을 선택하면 08:00.940 --> 08:04.390 그 톤을 이용해 회사 브로슈어를 생성하죠 08:04.510 --> 08:07.330 사실 엄청 쉬워요 08:07.450 --> 08:08.410 그러니 한번 해보세요 08:08.440 --> 08:08.980 그렇게 해요 08:08.980 --> 08:13.990 이 응용 프로그램을 강화해 기능성이 점점 더 높아지게 될 08:14.020 --> 08:14.920 거예요 08:14.950 --> 08:16.930 즐거운 시간 보내시길 바라요 08:16.930 --> 08:17.860 나중에 코드를 확인하세요 08:17.860 --> 08:18.880 Get it, get it. 보여주세요 08:18.880 --> 08:22.180 그럼 다음 강의에서 마무리하도록 하죠