inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

결제 받고 출시까지, 클로드 코드로 완성하는 내 웹서비스

Next.js — 30초 만에 내 사이트 통째로 받기

강의 소스 코드는 어디서 볼수 있나여?

해결된 질문

60

김동선

작성한 질문수 12

1

소스 코드는 어디서 볼수 있나여>?


HTML/CSS typescript next.js tailwindcss supabase claude 바이브코딩

답변 1

1

VibePlug

안녕하세요, 동선님! 질문 감사합니다.

바이브 코딩 강의라 소스 코드 공유를 생각치 못했는데, 말씀 듣고보니 막혔을 때 비교할 기준점은 있는게 맞네요! 바로 공개했습니다.

[레포 주소]

한 가지만 참고해주세요!

- 환경변수와 키는 빠져 있어서, 그대로 클론해서 실행되진 않아요. 강의대로 동선님의 프로젝트를 만들면서 비교하는 용도로 보시면 좋을 것 같아요 :)

혹시 특정 부분에서 막히셨거나 추가로 궁금한 점은 언제든 말씀주세요. 완강까지 응원하겠습니다!
이 강의 끝에 결제까지 돌아가는 동선님만의 멋진 서비스가 하나 생기길 바랍니다 😊

1

김동선

백엔드 소스는 없는 건가요?

백엔드 에서 toss로 결재 승인 요청 로직으 궁금 합니다.

2

VibePlug

넵, 백엔드를 별도 서버로 분리하지 않고 Next.js 하나로 풀스택으로 구현해서 백엔드 소스는 같은 레포 안에 들어있습니다.

서버 쪽 코드는 이 위치들입니다:

  • app/api/ → API 라우트 (cart, orders, features)

  • app/auth/callback/route.ts + proxy.ts → 인증 콜백과 세션

  • utils/supabase/ → client / server / admin 용 Supabase 클라이언트


여쭤보신 토스 결제 승인 로직은 여기입니다:

  • lib/toss.ts → 시크릿 키로 토스 승인 API(/v1/payments/confirm)를 호출하는 서버 전용 모듈

  • app/checkout/success/page.tsx → 결제창에서 돌아온 paymentKey·orderId·amount를 받아서, 성공 화면을 보여주기 전에 서버가 먼저 승인을 처리하는 페이지. 파일 상단 주석에 전체 순서(값 검증 → 주문 조회 → 금액 대조 → 승인 API → paid 변경 → 장바구니 정리)가 적혀 있어요.

이 부분은 38강 「마지막 도장은 서버가 찍는다 — 결제 승인과 금액 검증」에서 다룹니다.

  • 결제가 왜 요청과 승인 두 단계로 나뉜건지

  • 왜 서버가 승인 전에 DB의 주문 총액과 amount를 반드시 대조해야 하는지

  • 그리고 실제로 금액을 100원으로 조작해보는 실험까지

    그 수업에서 하나씩 풉니다 :)

DB 스키마는 Supabase MCP로 대화하며 만들어서 SQL 파일을 레포에 따로 두지 않았는데, 테이블 구조와 RLS 정책도 SQL로 뽑아서 프로젝트 폴더의 supabase/schema.sql 로 넣어두었습니다. 동선님 테이블과 비교하실 때 참고하세요 :)

그리고 강의 '새 소식'에도 관련 안내를 방금 올려두었는데요, 나중에 새 프로젝트를 시작하실 때 강의에서 완성한 DB 구조를 그대로 가져가고 싶으시면 이 파일을 Supabase SQL Editor에 붙여넣고 실행하는 것만으로 테이블과 RLS까지 한 번에 만들어집니다. 자세한 방법은 그 글에 적어두었습니다 :)

결제 섹션까지 가시면서 막히는 부분 있으면 언제든 말씀해주세요!

vercel 배포 관련 문의

0

10

0

클로드코드 아이콘 화면 표시

0

9

0

베개머리투자법 섹션 5를 듣고 질문드립니다.

0

16

2

계획 단계

0

14

1

raw 아래 파일관련인데요. 클리핑이나 복붙한 파일들말인데요

0

16

2

7강에서 클로드 프로젝트의 구성화면이 다릅니다.

0

39

1

저는 클로드 로고가 안떠 있어요 ㅜㅜ

0

31

1

terminl을 사용해서 cursor 명령어 입력하는데 커서가 실행되다가 자동으로 꺼집니다 왜그럴까요?

0

20

1

커서가 강의화면이랑 달라요!

0

23

1

강의자료

0

45

1

스크립트 영상 미일치

0

38

3

미국 써머 타임 적용에 대해서 질문입니다.

0

23

1

강사님 플랜보드 보면서 느끼는건데

0

41

1

테마분류 세부화 관련 질의

0

31

1

tdd green agent 에서 문의 드립니다.

0

38

2

강의 설명 중에 헷갈리는 것이 있네요

0

35

1

클로드 API 기간설정에 대해서

1

42

1

ㅋㅓ서화면이 강의화면하고 너무 달라요 ㅜ

0

50

1

클로드 사용 오류

0

60

3

/terminal setup 들어가면 명령어 설정 가능하다던데

0

53

2

claude는 프로젝트 안에서 꼭 시작해야 하나요?

0

51

2

만일 실물을 택배로 배송해야 할 경우 주소지 입력하는 방법이 궁금해서요.

1

76

4

31강 학습자료에 프롬프트가 엉뚱한것이 있어요

1

57

1

17강 강의에 목데이터 첨부파일이 없습니다.

2

78

2