Vercel에서 PostgreSQL 연결하기(설정 방식 변경)

유나랑·2024년 12월 3일

Next.js 튜토리얼 공식문서를 통해 학습을 진행하던 중 ch.6 Setting Up Your Database 과정에서 약간의 문제가 생겼던걸 정리해보고자한다.
현재 시점 이후에 학습하고있는 동료들 중에서 나와같은 일이 벌어진 사람이 있다면 도움이 되었으면 좋겠다.

Vercel에서 Git 연동으로 배포 후 데이터베이스 생성 과정부분이다.

문제 상황

Create a Postgres database 을 진행하던 중

이 이미지를 보면 Postgres 데이터베이스를 선택하여 데이터베이스를 만들면 된다.
하지만 이런식으로 옵션이 아예 없었다.

원인

이전에는 Vercel에서 직접 PostgreSQL을 연결할 수 있었지만 2024.11월부터 모든 새로운 PostgreSQL 데이터베이스는 Neon을 통해 생성해야하며, 기존 데이터베이스는 Neon으로 자동 이전된다.
이처럼 서비스가 바뀌었던것...!!!

참고
https://vercel.com/docs/storage/vercel-postgres

해결

Neon를 통해 데이터베이스를 생성하면 문제없이 될 것이다.

👉🏻 Neon을 선택 후 continue 클릭한다.

Region을 보면 Korea가 없을 것이다. 사실 크게 중요한 부분은 아니지만 거리에 따라 속도에 영향을 줄 수 있어서 가까운 지역으로 선택하면 된다.

👉🏻 한국과 가장 가까운 싱가포르를 선택 후 나머지는 그대로 적용하고 continue를 클릭한다.

👉🏻Datebase Name은 원하는 걸로 설정한 후 create 를 클릭하면 데이터베이스 만들기 성공!

추가

그 후 Next.js 튜토리얼 과정을 보면 seed 과정이 있는데 그 코드의 한 부분을 보면

export async function GET() {
  // return Response.json({
  //   message:
  //     'Uncomment this file and remove this line. You can delete this file when you are finished.',
  // });
  try {
    await client.sql`BEGIN`;
    await seedUsers();
    await seedCustomers();
    await seedInvoices();
    await seedRevenue();
    await client.sql`COMMIT`;

    return Response.json({ message: 'Database seeded successfully' });
  } catch (error) {
    await client.sql`ROLLBACK`;
    return Response.json({ error }, { status: 500 });
  }
}

이 코드가 정상작동하는 코드이다.
주석 처리된 부분도 함께 살펴보면 return이 실행되면 함수는 종료하게 된다. 그래서 try 문 안으로 진입하지 못하기 때문에 기존 코드에서 첫번째 return를 주석하거나 삭제해서 seed 할 수 있는 코드로 만들어줘야한다.

참고
https://hyeyeong1011.github.io/2020-03-11-post37/
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/return

마무리하며

개발 환경은 언제든지 변경되고 업데이트 된다. 항상 학습하며 배워가는 자세를 유지하도록 노력하자!!는 다짐을 한 번 더 할 수 있는 계기가 되었다.

0개의 댓글