AI Studio 로 만든 프론트에 Backend 연결 4번째 드디어 Supabase와 연결해 봅니다.
1. AI Studio로 Frontend 만들기
AI Studio에 프롬프트 입력하면 간단히 페이지를 만들어 줍니다
유튜브 쇼츠 대본을 만드는 앱을 만들어줘. 데이타는 supabase에 저장할 수 있도록 필요한 부분을 나에게 물어봐줘.
주제를 사용자에게 받아서 쇼츠 대본을 3씬 정도 만들어줘. 나래이션하고 이미지 프롬프트도 만들어주고, 이미지 생성 버튼을 누르면 이미지가 생성되도록 해줘.
2. Supabase 에 데이타베이스, 테이블, 권한 세팅
처음에는 제가 원하는 것을 넣지않고 그냥 테이블 만들어줘 했더니 원하지 않는 것을 만들었습니다.
시행착오 하고서 다시 시도.
데이블을 주제 테이블과 각 씬테이블을 분리해줘. 씬 테이블이 주제테이블에 키를 갖고 있도록 테이블 생성 SQL 부터 다시 작성해줘
마스터 테이블과 상세 테이블로 구분해서 잘 만들어줌.
권한 정책까지 세팅
3. Supabase Storage 추가, 권한 세팅
이미지를 올릴 storage를 만들고
접근 권한을 세팅해줘야 이미지를 올릴 수 있습니다.
4. Frontend에 Supabase 연경
배운 점
- 테이블 스키마도 Gemini가 알아서 만들어 준다는 사실. 고민할 필요가 없어졌어요.
- 테이블 한번에 만들도록 SQL 구문까지 만들어주는 것은 너무 편했어요.
- Storage 권한 세팅이 사실 처음에 잘 안되서 계속 찾아가면서 해서 조금 난이도가 있었습니다.
