묻고 답해요
156만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
프로젝트 생성 시 android 폴더 오류 및 npm run android 실행 오류
error Failed to install the app. Command failed with exit code 1: ./gradlew app:installDebug -PreactNativeDevServerPort=8081WARNING: A restricted method in java.lang.System has been called위와 같은 에러가 표시되어 안드로이드 시뮬을 킬 수가 없습니다. 방법대로 했는데, 이런 경우 어떻게 해야하나요?
-
미해결아바타 커뮤니티앱 만들기 (React Native Expo)
화면의 오른쪽에 스마트폰 화면을 배치하는 방법이 궁금합니다.
강의 화면 처럼 기기를 오른쪽에 배치하려면 어떻게 해야 하나요
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
Immer 에서 filter, map 사용
지난강의에서 useImmer에서 활용한 update함수에서는 push, splice와 같은 현재의 객체를 변환시키는 api를 활용했었습니다.그래서 immer 가 적용된 상황에서는, 현재 객체를 변환시키는 것만이 답일것이라 생각해서,오히려 filter api를 써야 코드가 더 간단해지는 상황에서는 useState를 따로 분리해서 써야 고민하고 있었습니다. 그런데 이번 강의에서 useImmerReducer에서 활용하는 것을 보아하니, State가 아니라 Immer 이 적용된 케이스더라도, return으로 새로운 객체를 반환하거나, 직접 객체에 변화를 주거나 하는 방법이 둘다 적용이 되는것으로도 보이는것 같더라구요?case 'deleted':에서도draft.filter에 return 이 적용되면, immerReducer라도 잘 작동하고,return을 없애고, break로 나오게 하면, 변화가 아무래도 적용이 안되더라구요(당연하겠죠... 원래 객체에 변화를 준것이 아니니) 그래서 immer나 immerReducer를 활용한다는 것은 useState을 확장시키는 느낌인건가요? 직접객체에 변화를 주는것 뿐만아니라, useState에서 했던것처럼 새로운 객체를 만들어 return하는 것 '까지' 가능한건가요?만약 immer가 적용된 상황에서, 직접 객체를 변환하는 코드와, 새로운 객체를 만들어 return 하는 코드가 하나에 전부 적용되어 있다면 어떻게 작용하나요?다시 말해, draft.push로 '변경사항이 immer에 반영되고', 동시에return으로 draft.filter한 값을 보내면, 어떻게 작용하며, 어떤 로직이 적용되나요?감사합니다
-
미해결Next + React Query로 SNS 서비스 만들기
seo 최적화 기준은 데이터 fetching인가요 아님 데이터 렌더링인가요?
seo 관련해서 궁금한게 있습니다.seo 최적화라는게 크롤링 봇이 서버에서 렌더링된 html을 크롤링하고 인덱싱하는걸로 알고 있습니다. 만약 서버 fetch 를 했지만 data 자체는 렌더링하지 않은 경우는 크롤링 봇이 어떻게 인식을 하는지 궁금합니다. 예를 들어 서버 fetch를 했지만 아래와 같이 서스펜스 역할하는 로직으로 인해 클라이언트 환경에서 hydrate 된 이후에 데이터가 렌더링된다면 서버에서 fetch는 이루어졌지만 렌더링된건 아니기 때문에 크롤링봇이 데이터를 인식하지 못하게 되는걸까요?? export function ConditionalClientWrapper({ children, fallback, }: ConditionalClientWrapperProps) { const [mounted, setMounted] = useState(false); useEffect(() => { setMounted(true); }, []); if (!mounted) return fallback ?? null; return children; } <ConditionalClientWrapper fallback={<Loading />}> //dataList에서 서버 fetch 가 이루어집니다. <dataList /> </ConditionalClientWrapper> SEO 최적화를 위한 조건이 데이터 렌더링인지 단순 서버 fetch 만하면 되는건지 궁금합니다. 추가로 리액트 쿼리의 prefetch를 사용하면 seo 최적화를 가질 수 있는건가요?? 감사합니다!
-
미해결아바타 커뮤니티앱 만들기 (React Native Expo)
KeyboardAwareScrollView 가 작동이 안돼요
윈도우 환경입니다.KeyboardAwareScrollView 가 작동이 안되네요.absolute를 없애봐도 안되고..scrollView를 주석 처리하고 해봐도 안되네요
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
vite 설치에 대해 질문있습니다.
안녕하세요 vite를 설치해서 리액트를 잘 사용하다가 최근 vite를 설치하고 npm run dev로 실행을 하니 아래 이미지와 같은 에러가 계속 나더라구요. 찾아보니 버전과 관련이 되어 있는거 같은데 아무리 찾아봐도 해결이 되지 않더라구요. 현재 vite는 사용하지 못하는건가요?
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
라이브러리 버전 일치 이슈
npm init vite@5.2.3 를 통해 설치 후 npm i를 통해 필요한 라이브러리를 다운 받을시에, 터미널 창을 통해 각종 경고 안내가 나옵니다.예를 들어 하나만 보여드리자면, npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported입니다.이처럼 온갖 라이브러리들이 '더 이상 지원하지 않는 버전임'을 명시하고 있는데, 최신 버전을 사용해서 수업을 따라가야 하나요, 아니면 '더이상 지원하지 않는 버전'의 라이브러리를 사용해서 코드를 짜도 이상이 없을까요? 안내해주신 것처럼 라이브러리 버전을 맞춰서 수업을 따라가고 싶은데, 터미널에서 이러한 경고를 보여주니, 버전을 맞출시에 '지원하지 않는 버전'문제로 인한 추가적인 오류가 생길까 걱정됩니다. 요약1.터미널에서 말하는 '더 이상 지원하지 않는 버전' 안내를 무시하고, 짐코딩님 강의의 라이브러리 버전을 사용해도 문제가 없을까요?2.최신 버전을 사용하고, 달라진 문법등의 오류를 감당하는게 나을까요?2번 질문의 문제에 대한 기술적인 지원을, 짐코딩님을 통해 받을 수 있을까요?
-
미해결React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
"Enter 키 발생 시 항목 추가" 부분에서 공백이 포함되면 한 줄이 더 입력됩니다
추가할 todo에 공백이 포함된 상태로 엔터를 입력하면 위와 같이 추가가 되는데 제가 잘못한 부분이 있을까요?https://github.com/juan-rybczinski/learn-react/commit/dba6aab43a96601fed941edfa652e4508f6a88e9
-
미해결아바타 커뮤니티앱 만들기 (React Native Expo)
headershown 관련 질문
[2-2] 네비게이션 구조 설정 with Expo Router여기서 최상단 _layout.tsx뿐만 아니라 모든_layout.tsx 에 모두 headershown을 false로 하는 이유가 따로 있는지 궁금합니다!
-
미해결아바타 커뮤니티앱 만들기 (React Native Expo)
54-55강 수정 내용 관련 질문
54강 강의 노트에서 수정 버전으로 작성 시 오히려 에러가 발생하여 질문드립니다! 수정 전에 오히려 문제가 없었는데, 수정 후 발생한 문제에 대해 어떻게 해결하면 좋을 지 답변주시면 정말 감사하겠습니다:)<에러 메시지>'context.previousPost'은(는) 'undefined'일 수 있습니다.ts(18048)
-
미해결아바타 커뮤니티앱 만들기 (React Native Expo)
리액트 웹 경험 없이 수강해도 괜찮을까요?
안녕하세요, Kyo 선생님!좋은 강의 항상 감사히 듣고 있습니다.다름이 아니라 한 가지 궁금한 점이 있어 연락드립니다.저는 고등학생이고, 현재 동아리 프로젝트에 활용하기 위해 리액트 네이티브 강의를 수강하고자 합니다.그런데 강의 소개에서 리액트 웹 개발 경험자를 대상으로 한다고 하신 것을 보았습니다.저는 아직 리액트 웹 경험이 없는데, 모르는 컴포넌트나 개념은 따로 찾아보면서 공부하면 강의를 무리 없이 따라갈 수 있을까요?아니면 리액트 웹을 먼저 공부하고 수강하는 것이 더 좋을까요?선생님의 조언 부탁드립니다. 감사합니다!
-
미해결아바타 커뮤니티앱 만들기 (React Native Expo)
로그인 요청시 에러
itialized +6ms📦 Loaded Entities: [ 'Image', 'Vote', 'Like', 'Post', 'Comment', 'User', 'UserVote', 'VoteOption'][Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RoutesResolver] PostController {/posts}: +92ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts, GET} route +16ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts/my, GET} route +15ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts/user/:id, GET} route +8ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts/search, GET} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts/:id, GET} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts, POST} route +2ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts/:id, PATCH} route +4ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts/:id, DELETE} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/posts/:postId/vote/:voteOptionId, POST} route +4ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RoutesResolver] AuthController {/auth}: +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/auth/signup, POST} route +2ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/auth/signin, POST} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/auth/me, GET} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/auth/me, PATCH} route +0ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/auth/:id, GET} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RoutesResolver] ImageController {/images}: +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/images, POST} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RoutesResolver] CommentController {/comments}: +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/comments, POST} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/comments/:id, DELETE} route +2ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RoutesResolver] LikeController {/likes}: +0ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/likes, GET} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/likes/:postId, POST} route +6ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RoutesResolver] NotificationController {/notification}: +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/notification, POST} route +1ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RoutesResolver] AvatarController {/avatar}: +2ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [RouterExplorer] Mapped {/avatar/:type, GET} route +8ms[Nest] 27196 - 2025. 07. 20. 오후 6:58:11 LOG [NestApplication] Nest application successfully started +22mshttp://localhost:3030[Nest] 27196 - 2025. 07. 20. 오후 6:58:18 ERROR [ExceptionsHandler] No metadata for "User" was found.EntityMetadataNotFoundError: No metadata for "User" was found. at DataSource.getMetadata (c:\community\server\server\node_modules\typeorm\data-source\src\data-source\DataSource.ts:450:30) at Repository.get metadata (c:\community\server\server\node_modules\typeorm\repository\src\repository\Repository.ts:53:40) at Repository.count (c:\community\server\server\node_modules\typeorm\repository\src\repository\Repository.ts:487:40) at AuthService.signup (c:\community\server\server\src\auth\auth.service.ts:38:50) at async c:\community\server\server\node_modules\@nestjs\core\router\router-execution-context.js:46:28 at async c:\community\server\server\node_modules\@nestjs\core\router\router-proxy.js:9:17 [Nest] 27196 - 2025. 07. 20. 오후 6:58:18 LOG [HTTP] [POST] /auth/signup (500) (okhttp/4.12.0)이렇게 오류가나는데 혹시나해서 백엔드 소스코드 자료에서 User도 등록이 되는지 로그찍어봤는데 되있더라구여회원가입 버튼을 누를때 이 에러가 뜨더라구여..
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
Vercel 무료버전 서버속도
강사님 강의 잘봤습니다,개인적으로 만들고 싶은게 있어서 하다가 postgres_changes로 채팅방 기능을 만들어서 배포를 하였는데로컬에서는 평균 속도가 200ms인데vercel 무료로 하니까 1.2s 정도 잡히더라구여그래서 쿼리문제인가 싶어서 컬럼도 필요한것만가져오고 나름대로 최적화를 진행했는데도배포에서만 느려가지고 제가 잘못하고 있나... 그래가지고 무료버전이라서 그런지 궁금합니다.
-
미해결Next + React Query로 SNS 서비스 만들기
next.js 서버fetch 에러 fallback ui 구현 방법
next 공식문서를 살펴보면 단순 서버 fetch (서버액션x) 관련 에러 핸들링 방법은 딱히 안나와 있는 것 같아 질문드립니다.만약 SectionA, SectionB, SectionC 서버 컴포넌트 내에서 각각 서버 fetch가 일어난다 가정했을 때 SectionB에서만 요청이 실패했다면 SectionB 영역만 fallback ui를 띄우고 나머지 SectionA, SectionC는 정상적으로 데이터를 렌더링하도록 구현하는 방법이 없을까요? error-boundary 라이브러리는 클라이언트 환경에서만 사용가능해 서버 컴포넌트에선 사용할 수 없고 next 내부적으로 설계되어있는 에러 바운더리(error.js 등)는 전역에러를 캐치하는 걸로 알고있습니다. 때문에 페이지 내 특정 영역만 fallback ui를 띄우는 용도는 아닌 것 같더라구요.혹시 다른 방법이 있나 궁금합니다 감사합니다!!
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
material 붉은 밑줄
이런식으로 저도 그렇고, 로펀님도 그렇고 material 가져올때 붉은 밑줄이 나오는데, 이거 안 나오게 하는 방법이 있나요?
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
파일 이름이 한글일 때 에러 발생
안녕하세요, 강의 내용대로 했는데 500 에러가 나서 확인해보니 한글로 된 파일일 경우 에러를 내는 상황입니다 ㅜ supabase 스토리지에서는 한글로된 이름을 허용하지 않는것 같은데, 따로 해결방법이 있을까요?
-
해결됨[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)
recoil 타입 에러
✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다.💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. recoil 이게 next에서 쓸 때에 따로 타입 에러 등 next가 recoil을 못 찾아내는 거 같은데, 강의 진행할때에는 recoil을 쓸거잖아요?이럴때에는 어떻게 해야 하나요? 버전을 낮추어야 하나요? 낮춘다면 어디 버전까지 낮춰야 할까요?
-
해결됨아바타 커뮤니티앱 만들기 (React Native Expo)
안드로이드 기준으로 원래 키보드가 터치로 안뜨나요??
인풋 컴포넌트를 누르면 email 까진 그래도 키보드 띄울수있게 바가 떠서 show on screen keyboard 누르면 키보드가 뜨는데비밀번호는 왼쪽 바도 안떠서요
-
미해결Next + React Query로 SNS 서비스 만들기
프레임워크 여론 파악법
next 15, app router를 알아갈수록 어째.. 제 취향에 안맞거나 제 서비스에 적용하기에 불리한 점들이 많은데요 저만 그런건지 궁금하기도 해서, 특정 프레임워크에 대한 평가나 여론을 알아보는 팁 같은게 있으신지 궁금합니다. 지금은 유튜브 검색해서 상위노출 영상 몇개에 의존하는데 모수가 부족한 느낌입니다 정석적으론 각 프레임워크 공식문서를 보고 그 특성들을 이해해 자기 서비스에 맞는걸 스스로 판단하는 것이겠지만, 그래도 집단지성에 기대고 싶네요ㅎ
-
미해결Next + React Query로 SNS 서비스 만들기
필터옵션이 많은 페이지에서 서버 fetch를 하는게 맞는걸까요??
next 공식문서에서 서버 fetch를 권장하고 있지만필터옵션이 다수 포진된 페이지에서도 서버 fetch를 해야할까 의문점이 듭니다.필터 버튼 하나 누를때마다 다시 fetch 해야하니까 route.push나 replace 할 수 밖에 없는데 이게 과연 좋은 방법인가 의구심이 듭니다.리액트 쿼리를 사용하는게 더 나을지, 서버 fetch를 사용하는게 나은지 선생님의 의견이 궁금합니다. 추가로 window.history.replaceState webAPI를 사용하면 단순 url만 변경하고 페이지 로드나 컴포넌트 리렌더링은 일어나지 않는걸로 알고 있는데요. 근데 리액트 쿼리로 클라이언트 fetch 할 땐 window.history.replaceState 로 url만 변경해도 다시 fetch가 되더라구요?? 어떤 원리로 동작하게 되는지 궁금합니다!