Angular 의 Signals 를 활용한 스트리밍 Gemini 채팅 앱 구축 및 Cloud Run 배포

이 글에서는 Angular 의 Signals 를 활용하여 실시간으로 응답을 스트리밍하는 Gemini 채팅 애플리케이션을 구축하고, 이를 Google Cloud Run 에 배포하는 방법을 설명합니다.

1. Angular 의 Signals 와 Observable 의 차이

   • Signals 는 React 의 Hooks 와 유사하게 컴포넌트 상태 관리를 위한 새로운 API 입니다.
   • Observables 는 아시컬러 (async/await) 를 처리하기 위해 주로 사용되었습니다.
   • Signals 는 더 간단하고 직관적인 방식으로 데이터를 관리할 수 있습니다.

2. 스트리밍 응답 구현

   • Gemini API 는 텍스트를 실시간으로 생성하며 전송합니다.
   • Angular 의 Signals 를 사용하여 각 토큰이 도착할 때마다 UI 를 업데이트합니다.
   • 이 방식은 사용자가 입력을 보낸 후 즉시 응답을 확인할 수 있게 합니다.

3. Cloud Run 에 배포

   • 애플리케이션은 Google Cloud Run 을 통해 호스팅됩니다.
   • Cloud Run 은 서버리스 컴퓨팅 서비스로, 코드만 업로드하면 자동으로 실행됩니다.
   • 이 방식은 확장성과 관리의 편의성을 제공합니다.

4. 실제 구현

   • Angular 프로젝트 생성 및 설정
   • Gemini API 키를 환경 변수에 저장
   • Signals 를 활용한 채팅 로직 구현
   • Cloud Run 에 배포하는 명령어 실행

이 과정을 통해 우리는 현대적인 웹 애플리케이션을 구축하고 배포하는 데 필요한 기술을 습득할 수 있습니다.