삽입·수정·삭제

데이터를 조회하는 법을 익혔으니 이제 데이터를 바꿀 차례입니다. Supabase 클라이언트는 insert, update, delete, upsert로 데이터 변경을 처리하며, 변경된 행을 그대로 돌려받을 수도 있습니다. 이 강의에서 각 메서드를 살펴봅니다.

학습 목표

• insert로 새 행을 추가한다.
• update로 기존 행을 수정한다.
• delete로 행을 삭제한다.
• upsert와 returning 동작을 이해한다.

데이터 삽입

insert에 객체 또는 객체 배열을 전달합니다.

const { data, error } = await supabase
  .from('posts')
  .insert({ title: '첫 글', content: '안녕하세요' });

여러 건을 한 번에 넣으려면 배열을 사용합니다.

await supabase.from('posts').insert([
  { title: '글 A' },
  { title: '글 B' },
]);

삽입 결과 받기 (returning)

기본적으로 insert는 삽입한 데이터를 반환하지 않습니다. select()를 이어 붙이면 생성된 행(자동 생성된 id 포함)을 돌려받습니다.

const { data } = await supabase
  .from('posts')
  .insert({ title: '새 글' })
  .select();

💡 TIP — 방금 만든 행의 id가 필요할 때(예: 상세 페이지로 이동)는 .select().single()을 함께 쓰면 객체 하나로 깔끔하게 받습니다.

데이터 수정

update에 변경할 필드를 전달하고, 반드시 필터로 대상을 지정합니다.

const { data } = await supabase
  .from('posts')
  .update({ published: true })
  .eq('id', 1)
  .select();

⚠️ 주의 — 필터 없이 update나 delete를 실행하면 테이블의 모든 행이 영향을 받습니다. 항상 eq 등으로 대상을 좁혔는지 확인하세요.

데이터 삭제

delete 역시 필터로 삭제 대상을 지정합니다.

const { error } = await supabase
  .from('posts')
  .delete()
  .eq('id', 1);

upsert

upsert는 행이 있으면 수정, 없으면 삽입합니다. 충돌 판단 기준은 기본 키 또는 onConflict로 지정한 컬럼입니다.

const { data } = await supabase
  .from('profiles')
  .upsert({ id: userId, username: 'syw', bio: '백엔드 학습 중' })
  .select();

동일한 id가 이미 있으면 해당 행이 갱신되고, 없으면 새로 생성됩니다. 설정값처럼 "있으면 업데이트, 없으면 생성"이 필요한 경우에 유용합니다.

요약

• insert는 객체 또는 배열로 한 건 이상 추가합니다.
• 변경 결과는 .select()를 이어 붙여 돌려받습니다(returning 역할).
• update와 delete는 반드시 필터로 대상을 한정해야 합니다.
• upsert는 충돌 키를 기준으로 삽입 또는 수정을 자동 선택합니다.

연습문제

1. posts에 제목이 테스트인 글을 하나 추가하는 코드는?
2. 삽입 후 생성된 행을 객체로 받으려면 어떤 메서드를 이어 붙이는가?
3. id가 3인 글의 published를 false로 바꾸는 코드는?
4. upsert가 삽입과 수정을 구분하는 기준은 무엇인가?

힌트 — returning은 .select()로, 대상 지정은 필터로 한다는 점을 기억하세요.