More
Flutter 앱에 Firebase Vertex AI를 사용하여 생성적 AI 통합하는 방법
11 분
소개 생성적 ai는 오늘날의 앱에서 빠르게 일반적인 것이 되어가고 있습니다 이는 개발자들이 스마트하고 상호작용적인 경험을 만들 수 있게 해줍니다 텍스트 생성, 콘텐츠 분석 또는 미디어 생성이든 firebase vertex ai는 flutter 앱 내에서 이러한 기능을 실현하기 위한 강력한 도구 세트를 제공합니다 이 튜토리얼에서는 firebase vertexai 패키지를 사용하여 flutter 앱에 생성적 ai를 도입하는 방법을 안내합니다 이 튜토리얼이 끝날 무렵에는 최소한 제미니의 api를 활용하여 모든 종류의 생성적 ai 작업을 수행할 수 있는 작동하는 애플리케이션을 갖게 될 것입니다 전제 조건 이 튜토리얼을 완료하려면 다음이 필요합니다 firebase 계정과 firebase 프로젝트가 설정되어 있어야 합니다 firebase https //firebase google com 에서 무료로 가입할 수 있습니다 로컬 머신에 flutter 개발 환경이 설정되어 있어야 합니다 아직 설정하지 않았다면 flutter 설치 가이드 https //flutter dev/docs/get started/install 를 따르세요 firebase와 flutter에 대한 기본 지식이 필요합니다 firebase가 처음이라면 flutter용 firebase 가이드 https //firebase flutter dev/docs/overview 를 확인하세요 1단계 – firebase 및 vertex ai 설정 firebase 프로젝트 생성하기 firebase 콘솔 https //console firebase google com/ , 새 프로젝트를 만들고 vertex ai에 필요한 api를 활성화합니다 firebase 앱 체크 활성화하기 firebase에서 프로젝트 설정으로 이동하여 firebase 앱 체크를 활성화하여 모든 api 호출이 앱에서 오는지 확인합니다 firebase를 flutter 앱에 추가하기 flutter 앱을 firebase 프로젝트에 연결하는 지침을 따릅니다 일반적으로 android의 경우 google services json 파일을 다운로드하거나 ios의 경우 googleservice info plist 파일을 다운로드하여 flutter 프로젝트의 올바른 디렉토리에 배치하는 작업이 포함됩니다 2단계 – 필요한 종속성 추가 파일을 열고 pubspec yaml 다음 종속성을 추가하세요 dependencies flutter sdk flutter firebase core latest version firebase vertexai latest version 2\ flutter pub get 를 실행하여 종속성을 설치하세요 3단계 – firebase 및 vertex ai 초기화 lib/main dart에서 필요한 firebase 패키지를 가져옵니다 import 'package\ flutter/material dart'; import 'package\ firebase core/firebase core dart'; import 'package\ firebase vertexai/firebase vertexai dart'; 2\ main 함수에서 firebase 및 vertex ai를 초기화하세요 void main() async { widgetsflutterbinding ensureinitialized(); await firebase initializeapp(); runapp(myapp()); } 3\ 당신의 myapp 위젯에서 생성 모델을 초기화하는 함수를 만드세요 class myapp extends statelesswidget { @override widget build(buildcontext context) { return materialapp( home scaffold( appbar appbar(title text('generative ai with firebase')), body center( child elevatedbutton( onpressed () async { final result = await generatecontent(); print(result); }, child text('generate content'), ), ), ), ); } future\<string> generatecontent() async { // initialize the generative model final vertexai = firebasevertexai instance; final generativemodel = vertexai getgenerativemodel( modelname 'projects/your project id/locations/your location/models/your model name', ); // construct your prompt final prompt = vertexaitextprompt(text 'write a story about a magic backpack'); // optionally, you can set generation configurations final generationconfig = vertexaigenerationconfig( temperature 0 7, responsemimetype 'application/json', ); // generate content final response = await generativemodel generatecontent( prompt prompt, generationconfig generationconfig, ); return response generatedtext; } } 'your project id'를 'your project id' , 'your location' , 그리고 'your model name' 으로 실제 프로젝트 세부정보로 교체하세요 generatecontent 함수는 프롬프트를 구성하고, 이를 vertex ai 모델에 전송하며, 생성된 콘텐츠를 반환합니다 4단계 – 프롬프트 구성 및 응답 처리 사용자 정의 프롬프트 만들기 다양한 유형의 데이터(텍스트, 이미지, 오디오 등)를 결합하여 더 복잡한 프롬프트를 만들 수 있습니다 예를 들어 final prompt = vertexaitextprompt( text 'summarize the following text "the history of ai is fascinating "', ); 2\ 대용량 파일 처리 프롬프트에 대용량 파일이 포함된 경우, 파일을 firebase storage에 저장하고 요청에 파일의 cloud storage url을 포함하세요 final prompt = vertexaitextprompt( text 'analyze the content of this document', fileurl 'gs\ //your bucket name/your file pdf', ); 3\ 스트리밍 응답 ai의 출력을 사용할 수 있을 때 스트리밍하려면 generatecontentstream 메서드를 사용할 수 있습니다 await for (final partialresponse in generativemodel generatecontentstream(prompt prompt)) { print(partialresponse generatedtext); } 5단계 – 앱 테스트 및 배포 flutter run 을 사용하여 앱을 실행하고 ai 생성 기능을 테스트하세요 생성된 내용이 콘솔에 출력되는 것을 볼 수 있어야 합니다 모든 것이 작동하는 것을 확인한 후, 앱을 배포하거나 추가 기능으로 계속 개선할 수 있습니다 결론 이 튜토리얼에서는 firebase vertex ai 패키지 를 사용하여 flutter 앱에 생성 ai를 포함하는 방법을 배웠습니다 gemini를 사용하여 텍스트 생성, 콘텐츠 데이터 분석 및 기타 많은 ai 기반 기능을 위한 훌륭한 인공지능 기능을 앱에 제공할 수 있습니다 firebase vertex ai의 유연성 덕분에 ai 응답을 마음대로 변경할 수 있어 지능적이고 상호작용적인 앱 개발에 적합합니다 pub dev 에서 firebase vertex ai, flutterfire 및 기타 flutter 패키지를 확인하세요 즐거운 코딩 되세요!