[Next.js]Supabase CLI로 각 테이블에 맞는 타입 생성

프로젝트를 진행하는 도중 supabase의 type을 쉽게 꺼내는 방법이 있다고 팀원분께서 말씀해주셔서 
해당 사항을 토대로 포스팅을 작성해보도록 한다. 

해당 사항은 Supabase Docs에서도 확인이 가능한 사항이다. 

[Generating TypeScript Types]
https://supabase.com/docs/guides/api/rest/generating-types

1. yarn add supabase --dev

-supabase cli를 프로젝트에 설치

2. yarn supabase login

-supabase cli를 통해 supabase 계정에 로그인하는 과정 

Enter키를 누르도록 하자.

잘 됨.

3. project의 아이디가 필요하다. project 아이디는 supabase 프로젝트를 생성했을 때 대쉬보드에 접근하면 url에서 얻을 수 있다. 

저 빨간 줄 쳐진 부분을 아래에 your-project-id 부분에 입력하여, 똑같이 cli 환경에서 명령어를 입력한다.
yarn supabase gen types typescript --project-id your-project-id > database.types.ts

위 절차를 그대로 따라하면 

Supabase 데이터베이스의 연관된 모든 type이 database.types.ts 파일로 생성되어 있다. 

 

해당 타입 파일을 사용하여, 아래와 같이 이용하면 된다.

 

 

학습 중 이보다 더 쉬운 방법을 찾았다. 더 쉬운 방법에 대해서 다음 포스팅을 작성하도록 하겠습니다.