inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

✅ Supabase에서 테이블 옆에 Unrestricted가 뜨는 이유와 해결법 정리

해결됨

한 입 크기로 잘라먹는 Next.js

Supabase에서 Table Editor > 테이블 옆에 Unrestricted가 아래처럼 뜨시는 분들은 RLS disabled를 클릭한 후에 RLS를 Enable로 해주시면 됩니다. RLS(Row Level Security)가 꺼져 있으면, 누구나 API로 테이블 데이터를 볼 수 있습니다. 실제 서비스에서는 RLS를 반드시 켜고, 접근 정책(Policy)을 설정해야 데이터가 안전하게 보호됩니다. RLS 활성화는 Table Editor에서 “Enable RLS” 클릭 → 정책 추가로 진행하면 됩니다.

  • react
  • typescript
  • next.js
Next 댓글 1 좋아요 0 조회수 340

연결 거부 해결 방법

해결됨

비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE

NextJS 를 연결하려고 하는데, 이렇게 뜨네요. 해결방법을 부탁드릴 수 있을까요?

  • flutter
  • next.js
  • cursor
  • supabase
  • 바이브코딩
댓글 3 좋아요 0 조회수 483

토스페이먼츠 연동하여 결제하기 오류

미해결

제로베이스부터 배우는 웹개발의 개념과 바이브 코딩

토스페이먼츠 연동하여 결제하기 기능 구현시 강사님의 영상과 다르게 오류가 나는데 도메인 localhost 가 실제 도메인 사용해야 한다고 합니다. 이럴경우 어떻게 해야 하나요? 영상과 실제가 너무 달라 애를 먹고 있어요.

  • react
  • 웹앱
  • next.js
  • cursor
  • 인공지능(ai)
soma 댓글 1 좋아요 0 조회수 342

폴링이 필요없는 이유

미해결

Next + React Query로 SNS 서비스 만들기

폴링이 필요없는 시대라고 하셨는데 그 이유가 궁금합니다

  • react
  • next.js
  • react-query
  • next-auth
  • msw
dev pple 댓글 2 좋아요 0 조회수 129

npx create-react-app

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

npx create-react-app myproject 입력하니까 무한로딩만 되고 설치가 안 돼서 yarn create react-app myproject으로 했는데도 안 되더라구요 다른 방법이 있을까요?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
댓글 1 좋아요 0 조회수 108

1-6 강 TODO List

해결됨

비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE

TOdo List 라는 툴도 설명해주셔서 감사드립니다. AI 가 생각보다 멍청하다 라는 말이 인상깊었는데요. 제가 궁금한 건 TODO List 를 작성해야하는 이유는 우리가 개발을 하다가 다시 다음 날 한다고 했을때, TODO List 를 설명하지 않고, 기억하고 있겠지 ? 라고 하면서 그대로 진행하는 것보다는 TODO List 로 한번 상기시켜주는 것이 좋다 라고 해석하면 될까요 ? 제가 아마 잘 못 따라간 것 같은데, 정확히 언제 쓰는게 맞는건지 조금만 더 구체적으로 설명해주시면 감사드리겠습니다.

  • flutter
  • next.js
  • cursor
  • supabase
  • 바이브코딩
ghuhan18 댓글 1 좋아요 0 조회수 60

1주차 질문

해결됨

비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE

1주차 1-5 질문 강의에서 보면 GPT 를 사용해서 GPT 기반 실시간 피드백 이라고 나와있는데, GPT 에서도 무료 사용자의 경우에는 사용 제한이 있지 않나요 ? 그렇게 되면 이 문제를 어떻게 해결할 수 있을까요 ? 제가 계속 결제하는 것 외에는 방법이 없을까요 ?

  • flutter
  • next.js
  • cursor
  • supabase
  • 바이브코딩
ghuhan18 댓글 2 좋아요 0 조회수 60

figma 채널 조인 오류

해결됨

비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE

웹소켓 켜고 커넥트 해서 채널 받았는데요. called join_channel 부터 안 되는데 왜 그럴까요? 계속 하다 보니 연결은 됐는데요. New client connected Received message from client: {"type":"join","channel":"kvisl10k"} Sending message to client: undefined New client connected New client connected 원래는 계속 Received message from client: {"type":"join","channel":"kvisl10k"} Sending message to client: undefined 여기까지만 나오고 안 된것 같은데 여러가지 확인하고 삭제하고 원복하고 하다보니 New client connected New client connected 이게 두번뜨고 연결이 되는데 왜 계속 sending ~ 여기까지만 나온걸까요?

  • flutter
  • next.js
  • cursor
  • supabase
  • 바이브코딩
freel 댓글 2 좋아요 0 조회수 131

figma mcp 연결 오류

해결됨

비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE

talktofigma 를 mcp.json 에 넣고 피그마에서 커넥트해서 웹소켓 실행까지 시켰는데 cursor settings에서 talktofigma 툴이 계속 빨간불입니다. 온/오프를 계속 바꿔도 0 tools enabled라고 계속 나오는데 왜 그럴까요..

  • next.js
  • cursor
  • 바이브코딩
댓글 2 좋아요 0 조회수 373

fetchTravelproductsIPicked 관련 질문 드립니다

미해결

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

해당 API 요청 시 사진처럼 $regex 오류 때문에 data를 받아오지 못하고 있습니다. 백엔드 문제일까요?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
mh 댓글 2 좋아요 0 조회수 106

질문 있습니다.

해결됨

한 입 크기로 잘라먹는 Next.js

안녕하세요 강의 듣던 중 질문 있습니다. access token 을 넣어서 fetch 함수를 사용하고 싶은데 클라이언트 레이어에서는 정상적으로 주입한 access token이 보이는데 서버 레이어에서는 구워진 access token이 없더라고요. 혹시 짐작 가는게 있으실까요?? 감사합니다.

  • react
  • typescript
  • next.js
Milkyway 댓글 2 좋아요 0 조회수 44

cursor-talk-to-figma-mcp plugin 이 다른 모양인데 왜 그럴까요?

해결됨

비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE

cursor-talk-to-figma-mcp plugin 의 sonnylab.com이 저의 경우 나오지 않고 , use localhost 버튼도 나오지 않는데 왜 그럴까요? 그래서 figma에 그려지는 것은 안되었습니다. 소스위치: https://github.com/grab/cursor-talk-to-figma-mcp 플러그인은 교재에서 연결

  • flutter
  • next.js
  • cursor
  • supabase
  • 바이브코딩
jitrade91 댓글 1 좋아요 0 조회수 245

컴파일 에러 및 의존성 충돌 문제

미해결

Next.js 완벽 마스터 (v15): 노션 기반 개발자 블로그 만들기 (with 커서AI)

안녕하세요, 진행하다가 여러 이슈가 발생해서 한 번에 묶어 여쭤보고자 합니다! 오류가 계속 발생해서 강사님 코드도 보았는데도 잘 모르겠습니다. Q: Hydration Mismatch 에러가 발생합니다. 서버와 클라이언트에서 렌더링되는 HTML이 다르다는데 어떻게 해결하면 될까요? Q: Next.js 15.3.0에서 remarkGfm과 rehype 플러그인들이 호환성 문제가 발생합니다. "Cannot read properties of undefined (reading 'inTable')" 에러 // app/blog/[slug]/page.tsx <MDXRemote source={markdown} options={{ mdxOptions: { remarkPlugins: [remarkGfm], rehypePlugins: [withSlugs, rehypeSanitize, rehypePrettyCode], }, }} /> Q: next-mdx-remote에서 rehype 플러그인 사용 시 타입 에러가 발생합니다. "Type 'Transformer<Root, Root>' is not assignable to type 'Transformer<any, any>'" 에러 // app/blog/[slug]/page.tsx (164번째 줄) rehypePlugins: [withSlugs, rehypeSanitize, rehypePrettyCode], Failed to compile. ./app/blog/[slug]/page.tsx:164:62 Type error: Type '(options?: Options | undefined) => void | Transformer<Root, Root>' is not assignable to type 'Pluggable<any[]>'. 162 | mdxOptions: { 163 | remarkPlugins: [remarkGfm], > 164 | rehypePlugins: [withSlugs, rehypeSanitize, rehypePrettyCode], | ^ Next.js build worker exited with code: 1 and signal: null Q: react-day-picker와 date-fns 버전 충돌이 발생합니다. react-day-picker@8.10.1은 date-fns@^2.28.0 || ^3.0.0을 요구하는데, 현재 date-fns@4.1.0이 설치되어 있어서 충돌합니다. // package.json { "dependencies": { "date-fns": "^4.1.0", "react-day-picker": "^8.10.1" } } Error: Command "npm install" exited with 1 npm error code ERESOLVE npm error ERESOLVE could not resolve npm error While resolving: react-day-picker@8.10.1 npm error Found: date-fns@4.1.0 npm error Could not resolve dependency: npm error peer date-fns@"^2.28.0 || ^3.0.0" from react-day-picker@8.10.1

  • react
  • 블로그
  • next.js
  • cursor
  • cursorai
산독기 댓글 2 좋아요 0 조회수 143

서버액션으로 단순히 조회하는 기능을 만들어서 사용해도 될까요?

해결됨

한 입 크기로 잘라먹는 Next.js

지금 강의에서 리뷰 리스트를 조회하는 api를 서버액션으로 작성해도 상관없는건가요? 예를 들어 직접 리뷰 리스트 DB에 접근해서 데이터를 가져오고 반환해주고, 페이지 컴포넌트에서는 단순히 const data = await getReview(); 를 작성해서 불러오는 방법처럼 말이죠 이 질문의 의도는 어떤 상황에서 서버액션을 써야하고, 어떤 상황에서 fetch를 써야하는지 아직 감이 잡히지 않아 질문드립니다! 강의를 보면서 서버액션은 Form에만 사용해야하는구나..라고 생각이들어서 혼란이 생겼던 것 같습니다.

  • react
  • typescript
  • next.js
oridori2705 댓글 2 좋아요 0 조회수 92

UI 뎁스에 관한 질문이 있습니다

해결됨

한 입 크기로 잘라먹는 Next.js

중첩된 라우팅에서 다른 레이아웃 혹은 레이아웃을 사용하고싶지 않을 때 어떻게 제어할 수 있는지 궁금합니다. 현재 소스를 보면 (with-searchbar) search book ... 와 같은 형태로 되어있는 것을 알 수 있는데요 만약에 search가 1 depth 라고 했을 때, search 페이지 아래에 예를 들어 detail-search 라는 주소를 가진 페이지가 있다고 가정할 때 (with-serachbar) serach detail-search 파일 구조 및 중첩된 라우터 구조가 위와 같이 되잖아요? 이 때 detail-search는 with-searchbar 대신 가령 with-detail-serachbar 라던가, 아예 with-searchbar 레이아웃을 사용하고 싶지 않을 수 있잖아요? 이럴 때 어떻게 해야하는지 궁금합니다 😀

  • react
  • typescript
  • next.js
김동훈 댓글 1 좋아요 0 조회수 68

강의에서 사용하는 api 접속 불가

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

안녕하세요~ 강의에서 사용하는 api 2개 다 접속이 안되네요 1번은 외부 서버라 안될수 있는데, 2번은 서버가 죽은 건가요? koreanjson.com http://main-example.codebootcamp.co.kr/graphql

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
김주원 댓글 2 좋아요 0 조회수 142

revalidateTag 에 대해서 질문이 있습니다.

미해결

한 입 크기로 잘라먹는 Next.js

안녕하세요! 좋은 Next.js 강의 덕분에 열심히 배워나가고 있는 학생입니다. 😀 다름이 아니라 revalidateTag를 사용했을 때, 첫 번째 인수로 전달한 태그 값을 가지는 데이터 캐시가 재검증된다고 이해했는데요! 제가 revalidateTag의 인수와 data fetch에 사용되는 옵션의 태그 값을 다르게 세팅해봤는데도 갱신이 되어서요. 제가 잘못 이해한 걸까요..?? 이 부분이 이상해서 질문 남깁니다. 아래는 제가 작성한 코드입니다! createReviewAction export async function createReviewAction(formData: FormData) { const bookId = formData.get('bookId')?.toString(); const content = formData.get('content')?.toString(); const author = formData.get('author')?.toString(); if (!bookId || !content || !author) { return; } // JSON.stringify 객체를 문자열 형태로 직렬화 해서 보내줘야 함 try { const response = await fetch( `${process.env.NEXT_PUBLIC_API_SERVER_URL}/review`, { method: 'POST', body: JSON.stringify({ bookId, content, author }), }, ); revalidateTag(`revew-${bookId}`); // 일부로 오타 냄 } catch (error) { console.error(error); return; } } ReviewList 컴포넌트 async function ReviewList({ bookId }: { bookId: string }) { const response = await fetch( `${process.env.NEXT_PUBLIC_API_SERVER_URL}/review/book/${bookId}`, { next: { tags: [`review-${bookId}`] } }, ); if (!response.ok) { throw new Error(`Review fetch faild: ${response.statusText}`); } const reviews: ReviewData[] = await response.json(); return ( <section> {reviews.map((review) => ( <ReviewItem key={`review-item-${review.id}`} {...review} /> ))} </section> ); }

  • react
  • typescript
  • next.js
fud3725 댓글 3 좋아요 0 조회수 101

강의 커리큘럼에 대해 질문이 있습니다.

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

안녕하세요 강의를 구매 후 듣다가 일이 생겨서 오랜만에 다시 공부하려고 하는데 커리큘럼을 다시 보니 처음에 html, css 강의 순서대로 나오다가 js가 나오고 또 섹션04부분에서 다시 css가 나오고 또 js가 나오더라구요 그래서 이 부분이 헷갈리는데 그냥 처음부터 순서대로 강의를 들으면 될까요?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
부드러운 족제비 댓글 2 좋아요 0 조회수 125

강의자료가 제공되는것으로 아는데, 어디서 받을 수 있나요?

해결됨

비개발자 4주만에 수익화 서비스 만들기: AI 바이브코딩 웹 + 앱 ALL IN ONE

현재 수강 진도를 함께 알려주세요! "1주차 3강까지 완료" 또는 "2주차 실습 중"처럼 어디까지 들으셨는지 적어주시면 맞춤형 답변을 드릴 수 있어요 2-3강 구체적인 상황과 함께 질문해주세요! "AI가 안 된다"보다는 "Cursor에서 이런 프롬프트를 입력했는데 이런 에러가 나와요"처럼 상세하게 적어주시면 더 정확한 답변을 드릴 수 있어요 스크린샷이나 코드를 첨부해주세요. 에러 화면, 현재 진행 상황을 보여주시면 문제 해결이 10배 빨라집니다! 마크다운 코드 블록(```)을 활용하면 더 깔끔하게 정리할 수 있어요 커뮤니티 검색을 먼저 해보세요. 같은 문제로 고민하신 분들이 이미 해결책을 찾았을 수도 있어요. 검색 후 못 찾으시면 언제든 새로 질문해주세요! 서로 도우며 함께 성장해요. 나도 모르는 건 "저도 궁금해요!"라고 댓글 달아주시고, 아는 건 적극적으로 공유해주세요. 가르치면서 더 잘하게 됩니다 바이브코딩 관련 질문은 환영, 기술 세부사항은 GPT 활용! 프롬프트 작성법, AI 도구 사용법은 여기서, 복잡한 코딩 문법은 ChatGPT에게 물어보시는 게 더 빨라요 진도나 과제 관련 문의는 1:1 문의를 이용해주세요. 개인적인 학습 계획, 환불, 수강 기간 연장 등은 따로 문의해주시면 더 자세히 상담드릴게요 실패 사례도 공유해주세요! "이렇게 했더니 망했어요" 같은 경험담도 다른 수강생들에게 큰 도움이 됩니다. 실패도 소중한 학습 자료예요 좋은 질문 예시 [진도] 2주차 5강 - React 컴포넌트 생성까지 완료 [질문] Cursor에서 버튼 컴포넌트 생성 시 에러 발생 상황: 2주차 실습 중 버튼 컴포넌트를 만들려고 하는데 프롬프트: "빨간색 버튼 컴포넌트 만들어줘" 에러 메시지: [스크린샷 첨부] 시도해본 것: GPT에게도 물어봤는데 같은 에러 발생 어떻게 해결하면 될까요?

  • flutter
  • next.js
  • cursor
  • supabase
  • 바이브코딩
man ai 댓글 3 좋아요 0 조회수 172

윈도우 -> 맥 파일 옮기기 / 실행

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

안녕하세요! 지금까지 수업을 윈도우 노트북으로 듣고 있었습니다. 그런데 노트북에 문제가 생겨 새로운 노트북으로 구매 후 파일을 옮기려고 하는데 이번에 구매한 노트북 운영체제 맥os입니다. 간편하게 옮기고 빠르게 실행 할 수 있는 방법이 있을까요?? 일단 node, npm, yarn까지 다운 받은 상태 입니다.

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
skykwj0422 댓글 1 좋아요 0 조회수 155

인기 태그

인프런 TOP Writers

주간 인기글