inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

묻고 답해요

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

웹훅 동기화 에러

미해결

Next.js 15로 완성하는 실전 YouTube 클론 개발

아래와 같은 에러 발생한다면 drizzle-orm 를 최신버전으로 업데이트 하시면 해결됩니다.

  • react
  • postgresql
  • 클론코딩
  • next.js
  • tailwindcss
  • drizzle
재쿤 댓글 1 좋아요 1 조회수 251

이 강의를 수강하려면 React와 javascript만 알고있으면 되나요?

해결됨

Next.js 15로 완성하는 실전 YouTube 클론 개발

프로젝트 하나 남기고 싶어서 강의는 구매했는데 React를 잘 몰라서 공부를 하고 난 뒤 강의를 수강하려고 합니다. 강의 설명에 언급된 React, javascript 외 추가적으로 더 알아야하는 사전 지식이 있을까요?

  • react
  • postgresql
  • 클론코딩
  • next.js
  • tailwindcss
  • drizzle
박민석 댓글 1 좋아요 1 조회수 302

승인된 리디렉션 URI등록 이유

미해결

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

승인된 리디렉션 URI에서 왜 3가지 https를 등록해 주는것인지 궁금합니다!

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

노션 링크 어디서 찾을 수 있나요?

해결됨

인프런 클론코딩 Part 1: Next.js와 NestJS로 시작하는 실전 프로젝트

혹시 노션 링크 어디서 찾을 수 있을까요? 초기 설정 할떄 몇몇 부분은 노션 없이 좀 하는데 어려움이 있어서요

  • aws
  • docker
  • next.js
  • nestjs
  • prisma
Gyubum Kim 댓글 2 좋아요 0 조회수 265

로펀의 인프런 상담소 슬랙 채널 주소

해결됨

인프런 클론코딩 Part 1: Next.js와 NestJS로 시작하는 실전 프로젝트

25년 06월 01일 기준, 노션페이지에서 해당 글이 안 보이는데 슬랙채널 링크 여쭤봐도 되나요?

  • aws
  • docker
  • next.js
  • nestjs
  • prisma
김아무개_본계정 댓글 3 좋아요 0 조회수 205

2-11 InferGetServerSidePropsType<T> 제네릭 관련 질문

해결됨

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

안녕하세요 getServerSideProps 함수로 반환된 props 타입을 정의하는데 있어서 이해가 잘 가지 않아 질문드립니다. props의 타입을 지정할 때, next js의 내장타입을 사용하면서 해당 타입의 제네릭으로 InferGetServerSidePropsType<typeof getServerSideProps> 이렇게 작성하는데, <typeof getServerSideProps> 의 값은 function인데 어떻게 props 내부의 값을 전달할 파악할 수 있는지 궁금합니다. 제가 제네릭에 대한 이해도가 낮아서 그런거 같기도 한데,,, 답변 주시면 감사드리겠습니다.

  • react
  • typescript
  • next.js
먼재 댓글 2 좋아요 0 조회수 81

커서 강의 질문

해결됨

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

선생님 프론트엔드 커서AI활용 코스의 경우에는 커서AI로 일일이 바이브 코딩하는건가요?? AI로 코딩할일이 뭐가 있을지 궁금합니다.

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
코드스타크 댓글 2 좋아요 0 조회수 118

Supabase를 사용하여 서비스에 사용자 인증 기능을 구현

미해결

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

선생님, 안녕하세요. Supabase를 사용하여 제 서비스에 사용자 인증 기능을 구현하려고 합니다. 제가 이해한 내용이 맞는지 확인 부탁드려요! (1)인증 방식 설정: Supabase 프로젝트 대시보드의 Authentication 섹션 내 Providers 탭으로 이동하고, 여기서 제 서비스 사용자들이 이용할 로그인 방식(예: 이메일/비밀번호, Google/Kakao 등의 소셜 로그인, Magic Link 등)을 선택하고 필요한 설정을 완료하여 활성화 한다. (2) 애플리케이션 프론트엔드 구현: 제 웹사이트코드(나 앱의 프론트엔드 예: JavaScript, React, Flutter 등)에서 Supabase 클라이언트 라이브러리를 가져와 사용하고, 사용자들이 회원가입, 로그인, 로그아웃 등을 할 수 있는 UI(예: 로그인 페이지, 회원가입 폼)를 만들고, 이 UI와 Supabase 클라이언트 라이브러리의 함수들 연동하여 실제 인증 기능을 구현한다. (3) 사용자 데이터 관리: 사용자가 위 프론트엔드를 통해 회원가입하면, 그 정보는 Supabase 내의 auth.users라는 전용 테이블에 자동으로 저장되는 것이 맞나요? 결론적으로, 제 서비스의 최종 사용자들은 제가 프론트엔드에 구현한 로그인/회원가입 시스템과 Supabase Auth를 통해 별도의 사용자 계정을 갖고 서비스를 이용하게 되는 구조라고 이해하면 될까요? 혹시 제가 잘못 이해하고 있거나, 추가적으로 고려해야 할 중요한 사항이 있다면 알려주시면 감사하겠습니다.

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

일반적인 css 꾸미기에서 width와 height의 값?

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

강의 잘 듣고 있습니다. 질문이 있는데요, 일반적인 css 꾸미기 에서 width와 height의 값 은 개발자가 아닌 웹디자이너가 항상 알려주기도 하나요 ? 즉 만약 vs code에서 파일이 index.html이 있고 index.css가 있다고 한다면, index.html에서 작성한 내용에 index.css에서 꾸며줄 시에 width 값과 height 값이 몇 픽셀인지, 혹은 몇 퍼센트인지 정할 때 잘 모르겠다면 어떻게 해야 하나요? 개발자가 width 값과 height 값을 잘 모른다면 감으로 크기를 늘렸다가 줄였다가 반복 하면서 적당한 width값과 height값을 찾아나가는 건가요? 피그마에서는 보통 디자인이 다 된 결과 값을 보고 vs code에 코딩한다면 상세 정보를 보고 width크기,height크기,폰트 크기, 폰트 weight 등등 다양하게 그대로 css에 적어주기만 하면 되는데요, 그랩 선생님 강의에서는 피그마로 볼 수 있게 추가 안내가 없어서, 스스로 강의 들은 이후 강의 없이 복습 할 시에(그랩마켓 웹화면 구현하기 1~3) 혹시나 각각 css로 꾸밀 때 width, height은 외우거나 혹은 보고 css에 적용하는 방식의 공부법 밖에 없는걸까요? 아니면 실무에서는 웹디자이너가 이미지등등의 경우에 width,height,기타 등등을 알려주기 에 그대로 css에 코딩해주면 되는 것인지요? 그랩님, 답변 부탁드립니다.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
isbcom1004 댓글 2 좋아요 0 조회수 123

여기서 디벨롭먼트고 프리빌드 앱을 써도 에러가 발생합니다.

미해결

React Native with Expo: 제로초에게 제대로 배우기

npm ls react npm ls react-native npm ls expo 버전을 알려주시면 질문자분과 동일한 환경에서 답변 드릴 수 있습니다. ERROR Warning: Error: The package '@react-native-kakao/user' doesn't seem to be linked. Make sure: - You rebuilt the app after installing the package - You are not using Expo Go

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
최우뚝 댓글 3 좋아요 0 조회수 215

Tanstack query 구조에 관해 질문 드립니다.

해결됨

아바타 커뮤니티앱 만들기 (React Native Expo)

엔드포인트마다 훅을 만드는 게 가장 좋은 방법일까요? 엔드포인트가 많아진다면 파일이 너무 많아질 것 같은데 더 좋은 방법이 있을까요?

  • javascript
  • react
  • react-native
  • typescript
  • react-query
항상공부하는벌레 댓글 2 좋아요 0 조회수 134

graphql 접속이 안됩니다.

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

graphql 포트폴리오용 주소는 접속이 되지만 graphql practice 주소와 rest-api practice 주소가 접속이 안되는 것 같습니다. http://practice.codebootcamp.co.kr/graphql http://practice.codebootcamp.co.kr/api-docs 해당 주소로 접속하였을 때 사이트에 연결할 수 없다고 나옵니다.

  • react
  • node.js
  • seo
  • graphql
  • next.js
댓글 2 좋아요 0 조회수 125

진짜에요..?

미해결

React Native with Expo: 제로초에게 제대로 배우기

flutter도 써봤고, react/next도 다 쓰고 있는데요... expo의 라우팅 구조가 진짜 번잡하고 혼란스럽다고 느껴지네요. 혹시 현업에서도 알려주신 라우팅 방법(group 폴더, index.tsx, layout.tsx 등 활용)이 최선인가요? 뭐랄까.. 이상한 스킬들로 겨우겨우 원하는 결과물을 만들어내는 느낌이에요 ㅠㅠ

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
스타트업을 논하는 여우 댓글 3 좋아요 0 조회수 230

expo-location 문제

미해결

React Native with Expo: 제로초에게 제대로 배우기

강의 내용을 진행하던 중 android 시뮬레이터에서 expo-location을 import할 수 없다는 에러가 뜨고 있습니다. expo-go를 통해서 진행하였습니다. 이전 질문도 같은 문제가 있어보여서 해결 방법으로 expo 버전을 조정해도 해결되지 않습니다..ㅠㅠ 버전은 아래와 같습니다. package.json { "name": "threads", "main": "expo-router/entry", "version": "1.0.0", "scripts": { "start": "expo start", "reset-project": "node ./scripts/reset-project.js", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web", "lint": "expo lint" }, "dependencies": { "@expo/vector-icons": "^14.1.0", "@react-navigation/bottom-tabs": "^7.3.10", "@react-navigation/elements": "^2.3.8", "@react-navigation/native": "^7.1.6", "expo": "53.0.9", "expo-blur": "~14.1.4", "expo-constants": "~17.1.6", "expo-font": "~13.3.1", "expo-haptics": "~14.1.4", "expo-image": "~2.1.7", "expo-linking": "~7.1.5", "expo-router": "~5.0.6", "expo-splash-screen": "~0.30.8", "expo-status-bar": "~2.2.3", "expo-symbols": "~0.4.4", "expo-system-ui": "~5.0.7", "expo-web-browser": "~14.1.6", "react": "19.0.0", "react-dom": "19.0.0", "react-native": "0.79.2", "react-native-gesture-handler": "~2.24.0", "react-native-reanimated": "~3.17.4", "react-native-safe-area-context": "5.4.0", "react-native-screens": "~4.10.0", "react-native-web": "~0.20.0", "react-native-webview": "13.13.5", "expo-dev-client": "~5.1.8", "expo-location": "~18.1.5" }, "devDependencies": { "@babel/core": "^7.25.2", "@types/react": "~19.0.10", "typescript": "~5.8.3", "eslint": "^9.25.0", "eslint-config-expo": "~9.2.0" }, "private": true }

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
cocococoa 댓글 2 좋아요 0 조회수 193

탭제거

미해결

React Native with Expo: 제로초에게 제대로 배우기

href:null을 추가해도 제일 우측 탭이 계속 안없어지는데 이유가 뭘까요..

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
khs1003k 댓글 2 좋아요 1 조회수 117

Project Rules 추가부분

미해결

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

안녕하세요 강사님의 강의 항상 정말 잘 듣고있습니다! 프로젝트 세팅 관련 질문이 있습니다! 강의 자료의 Project Rules 추가 부분은 커서ai 업데이트로 살짝 달라진 부분이 있는데요 추가로 주신 rules 강의 자료 봤는데 잘 모르겠어서 질문드립니다! 이런식으로 하는거 맞나요? 그리고 Notepads 역할 설정도 rules manual로 대체 가능하다고 하신거 같은데 이 경우 파일 확장자가 .mdc로 되는데 이렇게 해도 되는건가요?

  • next.js
  • cursor
  • cursorai
Subin Ryu 댓글 1 좋아요 0 조회수 112

fetch 캐싱과 revalidate 관련

미해결

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

안녕하세요 제로초님 fetch 캐싱과 revalidate 관련해서 궁금한 점이 있어 질문드립니다. await fetch('https://api.example.com/posts', { next: { revalidate: 60 }, }); A가 /posts를 최초 요청합니다. → API에서 데이터를 받아오고, 해당 데이터는 Next.js 서버 캐시에 저장 이후 60초 동안은 다른 누구든지 이 캐시된 데이터를 그대로 받음 그런데 60초가 지나기 전에 DB에서 게시글 1번의 제목이나 내용이 수정 됨 60초가 지나고 A가 다시 목록을 요청 → 이 시점은 revalidate 만료 시점 이후이므로 재검증 타이밍 → 하지만 A는 여전히 이전 캐시 데이터를 먼저 받고 , → A의 요청을 계기로 Next.js가 백그라운드에서 API를 다시 fetch하여 캐시를 갱신 곧이어 B가 /posts를 요청하면 → B는 A 덕분에 갱신된 최신 데이터를 바로 받음 제가 이해한 것이 맞을까요? 만약 저런식으로 동작하면 상세 페이지와 데이터 불일치 문제가 발생할 수 있지 않을까 해서요 만약 상세 페이지 요청도 이렇게 작성되어 있다면 await fetch('https://api.example.com/posts/1', { next: { revalidate: 60 }, }); A는 목록 요청만 했고, 상세 페이지는 요청하지 않음 B는 A 이후에 목록을 보고 → 최신 제목을 확인한 뒤 , → 게시글 1번의 상세 페이지를 클릭 그런데 상세 페이지의 제목은 여전히 수정 전의 이전 제목 으로 보임 → 목록과 상세 페이지 간에 데이터가 불일치 할 수 있음 정리하자면 제가 이해한 Next.js의 fetch + revalidate 캐시 동작이 맞는지 궁금하고 위와 같은 목록-상세의 데이터 불일치 현상은 실제로 발생 가능한 문제인지 궁금합니다. 제가 실제로 테스트해봤을 때 위 시나리오대로 목록과 상세 페이지에서 서로 다른 제목이 보이는 걸 확인했습니다. 혹시 제가 잘못 이해하고 테스트한 부분이 있는 건지, 아니면 실제로도 발생할 수 있는 동작인지 궁금합니다.

  • react
  • next.js
  • react-query
  • next-auth
  • msw
찹찹이 댓글 2 좋아요 0 조회수 123

forwardRef 지원 중단에 대한 대응?

해결됨

맛집 지도앱 만들기 (React Native & NestJS)

https://ko.react.dev/reference/react/forwardRef 공식문서를 보면 앞으로는 forwardRef 지원을 중단한다고 나와있는데 이에 대응하려면 코드 작성을 어떻게 하면 될까요?

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
rsuubinn 댓글 2 좋아요 0 조회수 147

리액트 쿼리를 사용할 이유...

해결됨

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

안녕하세요! 강의 잘 듣고 있습니다. Next에서 제공하는 fetch의 기능만 잘 활용해도 React Query를 사용할일이 잘 없을것같은데.. 무한스크롤같은 기능을 구현할때정도는 편하긴 할것같지만, 보통 App Router환경에서 React Query를 활용할 수 있는경우가 어떤 경우가 있을까요??

  • react
  • typescript
  • next.js
신희준 댓글 2 좋아요 0 조회수 196

인기 태그

인프런 TOP Writers

주간 인기글