Firebase의 Gemini를 사용하여 클라이언트 측 코드에 포함할 스키마, 쿼리, 변형을 만들 수 있습니다.
앱을 설명하고 데이터 모델을 요약하거나 생성하려는 쿼리 또는 변형을 자연어로 설명하면 Firebase의 Gemini에서 GraphQL 등가 항목을 제공합니다.
이 AI 지원은 다양한 개발 컨텍스트에서 사용할 수 있습니다.
- Firebase 콘솔에서 출력을 실행하고 테스트하고, 스키마와 작업을 프로덕션에 배포하고, 로컬 개발 환경에 동기화합니다.
- 로컬에서 Data Connect VS Code 확장 프로그램에서 로컬 PostgreSQL 데이터베이스 및 에뮬레이터와 함께 Gemini Code Assist를 사용하여 설계, 실행, 테스트합니다.
Data Connect 스키마, 쿼리, 변형에서 쿼리 및 변형에 대해 자세히 알아보세요.
AI assistance for Data Connect에서 데이터를 사용하는 방식
Firebase의 Gemini에서 사용자 데이터를 사용하는 방법에 관한 자세한 내용은 Firebase의 Gemini에서 사용자 데이터를 사용하는 방법을 참조하세요.
AI assistance for Data Connect 설정
Data Connect의 AI 지원을 설정하려면 Firebase의 Gemini 설정에 설명된 대로 Firebase의 Gemini를 사용 설정한 다음 Firebase의 Gemini로 GraphQL 쿼리 및 변형 생성으로 진행합니다.
Firebase의 Gemini를 사용하여 GraphQL 스키마, 쿼리, 변형 생성
Data Connect의 AI 지원은 다양한 맥락과 여러 워크플로에서 사용할 수 있습니다.
Firebase 콘솔에서 새 앱과 초기 스키마 및 작업 만들기
새 Firebase 프로젝트를 만들고 새 앱을 개발하도록 설정하면 Firebase Console에서 스키마 및 작업 생성을 위한 AI 지원을 자동으로 제공합니다.
이 설정 흐름을 통해 앱을 설명한 다음 AI 지원을 설명할 수 있습니다.
- 전체 Data Connect 스키마를 생성합니다.
- 클라이언트 코드와 통합할 수 있는 유용한 핵심 쿼리 및 변형 집합을 생성합니다.
Console에서 만든 이러한 리소스를 로컬 개발 환경에 동기화하여 클라이언트와의 통합을 계속합니다.
이 워크플로는 시작 가이드에 설명되어 있습니다.
Firebase 콘솔에서 실행할 새 쿼리 및 변형 추가
AI assistance for Data Connect를 사용하여 자연어를 기반으로 GraphQL을 생성하려면 다음 단계를 따르세요.
프로젝트에서 Data Connect를 열고 서비스에서 데이터 소스를 선택합니다.
데이터를 클릭합니다.
GraphQL 글쓰기 도우미pen_spark 아이콘을 클릭합니다.
표시되는 텍스트 입력란에 생성하려는 쿼리 또는 변형을 자연어로 설명하고 생성을 클릭합니다.
예를 들어 'Data Connect로 빌드(웹)' Codelab에 참조된 영화 데이터 소스를 사용하는 경우 '2022년 상위 5개 영화를 평점 순, 내림차순으로 반환해 줘.'라고 요청하면 다음과 같은 결과가 반환될 수 있습니다.
query TopMovies2022 { movies(where: {releaseYear: {eq: 2022}}, orderBy: [{rating: DESC}], limit: 5) { id title rating releaseYear } }대답을 검토합니다.
- 대답이 올바른 것 같으면 삽입을 클릭하여 코드 편집기에 대답을 삽입합니다.
- 대답을 수정할 수 있는 경우 수정을 클릭하고 프롬프트를 업데이트한 다음 재생성을 클릭합니다.
대답을 수락한 후 해당하는 경우 파라미터 섹션에서 다음을 설정합니다.
- 변수: 쿼리 또는 변형에 변수가 포함된 경우 여기에서 정의합니다. JSON을 사용하여 정의합니다(예:
{"title":"The Matrix", "releaseYear":"1999"}). - 승인: 쿼리 또는 변형을 실행할 승인 컨텍스트(관리자, 인증됨, 인증되지 않음)를 선택합니다.
- 변수: 쿼리 또는 변형에 변수가 포함된 경우 여기에서 정의합니다. JSON을 사용하여 정의합니다(예:
코드 편집기에서 실행을 클릭하고 결과를 검토합니다.
코드 편집기에서 여러 쿼리 또는 변형을 테스트하려면 이름을 지정해야 합니다. 예를 들어 다음 쿼리의 이름은 GetMovie입니다. 커서를 쿼리 또는 변형의 첫 번째 줄로 이동하여 실행 버튼을 활성화합니다.
query GetMovie($myKey: Movie_Key!) {
movie(key: $myKey) { title }
}
로컬 프로토타이핑 중에 초기 스키마 및 작업 만들기
Visual Studio Code 및 Data Connect VS Code 확장 프로그램을 사용할 때 Gemini Code Assist에서 로컬 프로토타입 제작 작업에 AI 지원을 사용할 수 있습니다.
이 확장 프로그램을 사용하면 앱을 설명한 후 Gemini Code Assist 다음 작업을 할 수 있습니다.
- 전체 Data Connect 스키마를 생성합니다.
- 클라이언트 코드와 통합할 수 있는 유용한 핵심 쿼리 및 변형 집합을 생성합니다.
이 워크플로는 로컬 프로토타입 제작 시작 가이드에 설명되어 있습니다.
AI assistance for Data Connect 사용 사례 더보기
다음 섹션에서는 Gemini에 Data Connect를 채우기 위한 변형을 만들도록 요청한 다음 쿼리하여 결과를 확인할 수 있는 경우를 비롯한 샘플 사용 사례를 설명합니다.
사용자 입력을 기반으로 데이터베이스에 영화를 추가하는 변형 만들기
이 섹션에서는 자연어를 사용하여 데이터베이스를 채우는 데 사용할 수 있는 변형에 관한 GraphQL을 생성하는 예를 살펴봅니다. 이 예에서는 Firebase Data Connect 문서 및 'Data Connect로 빌드 (웹)' Codelab에 사용된 영화 데이터베이스 스키마를 사용한다고 가정합니다.
Firebase 콘솔에서 Data Connect를 엽니다.
서비스와 데이터 소스를 선택한 다음 데이터 탭을 엽니다.
GraphQL 글쓰기 도우미pen_spark 아이콘을 클릭하고 표시되는 상자에 쿼리를 입력합니다.
Create a movie based on user input.생성을 클릭합니다. 변형이 반환됩니다. 예를 들어 Gemini는 다음과 같은 변이를 반환할 수 있습니다.
mutation CreateMovie($title: String!, $releaseYear: Int!, $genre: String!, $rating: Float!, $description: String!, $imageUrl: String!, $tags: [String!] = []) @auth(level: USER) { movie_insert(data: { title: $title, releaseYear: $releaseYear, genre: $genre, rating: $rating, description: $description, imageUrl: $imageUrl, tags: $tags }) }출력을 검토합니다. 필요한 경우 수정을 클릭하여 프롬프트를 수정한 다음 재생성을 클릭합니다.
그런 다음 삽입을 클릭하여 데이터 편집기에 변형을 삽입합니다.
변형을 실행하려면 변수를 추가해야 합니다. 매개변수 섹션에서 변수를 열고 몇 가지 테스트 변수를 포함합니다.
{"title":"My amazing movie", "releaseYear":2024, "genre": "Comedy", "rating": 8, "description": "A new movie to test mutations", "imageUrl": "", "tags": ["comedy","space travel"]}실행을 클릭합니다.
그런 다음 영화가 추가되었는지 확인하는 쿼리를 만듭니다. GraphQL 글쓰기 도우미 pen_spark를 클릭하고 표시되는 상자에 프롬프트를 입력합니다.
List all movies from 2024 that include all of these tags: 'space travel', 'comedy'.Gemini는 다음과 같은 응답을 반환할 수 있습니다.
query ComedySpaceTravelMovies2024 @auth(level: PUBLIC) { movies( where: { releaseYear: { eq: 2024 }, tags: { includesAll: ["space travel", "comedy"] } } ) { id title imageUrl releaseYear genre rating description tags } }쿼리를 삽입하고 실행합니다. 추가한 영화가 기록 입력란에 표시됩니다.
사용자가 제공한 장르 및 평점을 기반으로 리뷰를 나열하는 쿼리 만들기
이 섹션에서는 자연어를 사용하여 쿼리의 GraphQL을 생성하는 예를 살펴봅니다. 이 예에서는 Firebase Data Connect 문서 및 'Data Connect로 빌드 (웹)' Codelab에 사용된 영화 데이터베이스를 사용한다고 가정합니다.
Firebase 콘솔에서 Data Connect를 엽니다.
서비스와 데이터 소스를 선택한 다음 데이터 탭을 엽니다.
GraphQL 글쓰기 도우미pen_spark 아이콘을 클릭하고 표시되는 상자에 쿼리를 입력합니다.
List all movie reviews, based on user-configurable genre and ratings.생성을 클릭합니다. 쿼리가 반환됩니다. 예를 들어 Gemini는 다음과 같은 쿼리를 반환할 수 있습니다.
query ListReviewsByGenreAndRating($genre: String, $minRating: Int, $maxRating: Int) @auth(level: PUBLIC) { reviews(where: { movie: { genre: {eq: $genre} }, rating: {ge: $minRating, le: $maxRating} }) { id user { username } movie { title genre } rating reviewText reviewDate } }출력을 검토합니다. 필요한 경우 수정을 클릭하여 프롬프트를 수정한 다음 재생성을 클릭합니다.
그런 다음 삽입을 클릭하여 데이터 편집기에 변형을 삽입합니다.
이 쿼리를 테스트하려면 변수를 추가해야 합니다. 매개변수 섹션에서 변수를 열고 테스트에 사용할 변수를 포함합니다.
{"genre":"sci-fi", "minRating":4, "maxRating":9}실행을 클릭합니다.
서드 파티 AI 지원 도구와 함께 사용할 프롬프트 디자인
모든 AI 지원 도구 및 상담사와 마찬가지로 프롬프트가 더 나을수록 결과물이 더 유용합니다.
Firebase에서 Gemini에 자연어 프롬프트를 제공하면 백그라운드에서 어시스턴트가 입력을 더 완전하게 개발된 프롬프트로 변환합니다.
Firebase 또는 다른 Firebase AI 지원에서 Gemini를 사용하지 않고 Cursor 또는 Windsurf와 같은 서드 파티 AI 도구를 사용하는 경우 유사한 상세 프롬프트를 사용하여 Data Connect에 관한 더 나은 추천을 받을 수 있습니다.
다운로드하여 조정하고 IDE에 복사할 수 있는 프롬프트 템플릿을 게시했습니다.
다운로드하고 수정한 후 다음과 같이 익숙한 도구 (예: 커서 또는 Windsurf)에서 프롬프트를 만듭니다.
Cursor에서 (최신 Cursor 안내를 검토하세요.):
- 오른쪽 상단의 설정 아이콘을 클릭합니다.
- 규칙 탭을 선택합니다.
- 프로젝트 규칙에서 새 규칙 추가 버튼을 클릭합니다.
- 규칙을 복사하여 붙여넣습니다.
Windsurf (최신 Windsurf 안내를 검토하세요.):
- 오른쪽 상단의 Cascade 버튼을 클릭하여 Cascade 창을 엽니다.
- 캐스케이드의 오른쪽 상단 슬라이더 메뉴에서 맞춤설정 아이콘을 클릭한 다음 규칙 패널로 이동합니다.
- + 전체 또는 + 워크스페이스 버튼을 클릭하여 각각 전체 또는 워크스페이스 수준에서 새 규칙을 만듭니다.
- 규칙을 복사하여 붙여넣습니다.
문제 해결 AI assistance for Data Connect
Firebase의 Gemini 문제 해결을 참조하세요.
가격 책정
AI assistance for Data Connect는 개별 사용자에게 제공되는 Firebase의 Gemini의 일부로 제공됩니다.
자세한 내용은 Firebase의 Gemini 가격 책정을 참조하세요.
다음 단계
- Data Connect 스키마, 쿼리, 변형에서 쿼리 및 변형에 대해 자세히 알아보세요.
- Firebase의 Gemini에 대해 자세히 알아보세요.