inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

npx create-react-app cra-react-app 실행시 에러가 발생합니다.

미해결

React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지

뭔가 잘 모르겠는데.. 아래 확인 부탁드려도 될까요? 설정한것도 없는것 같은데 기본 생성 명령어자체가 실행이 안된다니..ㅠㅠㅠㅠ manijang2@gimseonman-ui-MacBookAir VSProjects % npx create-react-app cra-react-app Creating a new React app in /Users/manijang2/VSProjects/cra-react-app. Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts with cra-template... added 1324 packages in 40s 268 packages are looking for funding run `npm fund` for details Initialized a git repository. Installing template dependencies using npm... npm error code ERESOLVE npm error ERESOLVE unable to resolve dependency tree npm error npm error While resolving: cra-react-app@0.1.0 npm error Found: react@19.0.0 npm error node_modules/react npm error react@"^19.0.0" from the root project npm error npm error Could not resolve dependency: npm error peer react@"^18.0.0" from @testing-library/react@13.4.0 npm error node_modules/@testing-library/react npm error @testing-library/react@"^13.0.0" from the root project npm error npm error Fix the upstream dependency conflict, or retry npm error this command with --force or --legacy-peer-deps npm error to accept an incorrect (and potentially broken) dependency resolution. npm error npm error npm error For a full report see: npm error /Users/manijang2/.npm/_logs/2025-02-03T13_23_36_276Z-eresolve-report.txt npm error A complete log of this run can be found in: /Users/manijang2/.npm/_logs/2025-02-03T13_23_36_276Z-debug-0.log `npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0` failed manijang2@gimseonman-ui-MacBookAir VSProjects %

  • react
  • React-Context
  • react-router
  • tailwindcss
  • react-query
김선만 댓글 3 좋아요 1 조회수 319

AccessToken 만료시 홈화면 이동이 안되는거 같은데요?

해결됨

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

❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. 모든 강의를 듣고나서 이것저것 공부를 하던 중 실습에서도 AccessToken 만료 테스트를 하신적이 없는거같아서 서버단 .env 에서 JWT_ACCESS_TOKEN_EXPIRATION=1m 요렇게 두고 number.ts 소스에서도 ACCESS_TOKEN_REFRESH_TIME: 1000 * 60 * 1 - 1000 * 60 * 0.7, 이렇게 바꾸어 1분만에 만료되게 해서 테스트 해보니 만료는 되는데 만료된 후 이렇게 401 에러가 뜨면서 홈화면으로 넘어가지를 않네요... 선생님 전체소스를 받아서 테스트를 해보아도 마찬가지입니다.. AccessToken 만료시 테스트가 이루어지지 않은 소스인건지.. 아니면 제가 누락한 부분이 있는걸까요?

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

react 19버전에서는 recoil사용이 어렵나요?

해결됨

[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14)

✅ 모든 질문들은 슬랙 채널에서 답변드리고 있습니다. 💡 ”로펀의 인프런 상담소” 슬랙 채널 가입하기 💡 평일중에는 퇴근 이후(저녁 7시)에 답변을 받아보실 수 있고, 주말중에는 상시 답변드리고 있습니다. 안녕하세요. recoil 강의 부분에서 하나의 에러로 인해서 진행이 막힌 상태입니다! TypeError: Cannot destructure property 'ReactCurrentDispatcher' of ' {imported module [project]/nodemodules/next/dist/compiled/react/index.js [app-client] (ecmascript)} .default.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' as it is undefined. "dependencies": { "next": "15.1.6", "react": "^19.0.0", "react-dom": "^19.0.0", "recoil": "^0.7.7" }, next 15 & react 19 버전으로 진행중이었는데 구글링을 해보아도 다들 더이상 recoi은 사용하지말라 이런 답만 알려주고있어 해결하기가 어려운 상태네요. 결국 버전문제인 것 같은데, 최신 버전으로 해당 문제가 해결이 어렵다면 다른 상태관리 라이브러리를 사용하며 진행하고싶은데요, Zustand 라이브러리를 사용해도 진행에 무리없을까요?

  • firebase
  • next.js
  • tailwindcss
  • react-query
  • supabase
댓글 2 좋아요 0 조회수 1541

AWS EC2+RDS+S3 배포하여 서버 백그라운드 실행질문

해결됨

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

❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. 강의를 전부 듣고나서 AWS에 EC2+RDS+S3 까지 셋팅하고 EC2에 깃험 클론하여 소스 가져오고 EC2 백그라운드에 서버를 상주시키고 싶은데 방법을 잘모르겠습니다. 좀더 자세히 알려주실 수 있으실까요? 현재는 matzip폴대내 front, server 소스를 EC2 에 가져온 상태이고요 우분투에서 npm run start dev 로 서버를 실행시켜서 스마트폰에 실제 배포해서 해보니 EC2, RDS, S3 전부 잘연결되서 실행되는것은 확인했습니다. 그런데 npm run start dev로 실행하는거말고 ec2 서버에 백그라운드에 항상 서버를 동작시키고 싶은데 어떻게 해야할까요? 도와주세요.

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

에러가 나옵니다

미해결

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

말씀하신대로 ruby의 버전을 2.7.6 버전을 맞췄음에도 불구하고 위와 같이 에러가 나와서 에러 해결시에 필요하다고 안내받은 sudo gem install cocoapods를 설치했는데 설치시에도 버전이 안맞다고 에러가 나와서 그에 맞는 버전으로 설치했지만 결국 위 와같은 에러가 나옵니다 많은 시간을 투자했지만 되고 있지않습니다. ㅠㅠㅠ

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
강동우 댓글 2 좋아요 0 조회수 229

npx react-native@0.72.6 init MatzipApp --version 0.72.6 오류

미해결

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

npx react-native@0.72.6 init MatzipApp --version 0.72.6 ruby 2.7.6 -> ruby 3.1.0 시작이 안되고 있어요. 도와주세요.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
Seungil Jang 댓글 1 좋아요 0 조회수 344

auth.ts 에서 오류가 납니다.

미해결

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

안녕하세요, 클론코딩 강좌 따라하던중 오류가 나는데 강사님 깃헙 클론해서 완성본 봐도 같은 오류가 나는것 같은데 무슨오류일까요.. ?

  • react
  • next.js
  • react-query
  • next-auth
  • msw
rhdbwls5766 댓글 2 좋아요 0 조회수 204

6강 강의 듣는 중 FeedHomeHeaderLeft(navigation) 의 navigation 파라미터 넘기는 부분 에러발생

해결됨

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

❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. 다음의 코드에서 <Stack.Screen name={feedNavigations.FEED_HOME} component={FeedHomeScreen} options={({navigation}) => ({ headerTitle: '피드', headerLeft: () => FeedHomeHeaderLeft(navigation), })} /> FeedHomeHeaderLeft(navigation) 부분에 navigation이 에러가 나는데 에러는 다음과 같습니다. Argument of type 'StackNavigationProp<FeedStackParamList, "FeedHome", undefined>' is not assignable to parameter of type 'FeedHomeHeaderLeftProps'. Type 'Omit<NavigationHelpersCommon<FeedStackParamList, StackNavigationState<FeedStackParamList>>, "getParent"> & { ...; } & EventConsumer<...> & PrivateValueStore<...> & StackActionHelpers<...>' is missing the following properties from type 'Omit<Omit<NavigationHelpersCommon<FeedStackParamList, StackNavigationState<FeedStackParamList>>, "getParent"> & ... 9 more ... & { ...; }, "getParent" | ... 13 more ... | keyof EventConsumer<...>>': jumpTo, openDrawer, closeDrawer, toggleDrawerts(2345) (parameter) navigation: StackNavigationProp<FeedStackParamList, "FeedHome" , undefined > FeedHomeHeaderLeft.tsx 에서 type FeedHomeHeaderLeftProps = CompositeNavigationProp< StackNavigationProp<FeedStackParamList>, DrawerNavigationProp<MainDrawerParamList> >; function FeedHomeHeaderLeft(navigation: FeedHomeHeaderLeftProps) { return ( <HeaderButton icon={<Ionicons name="menu" color={colors.BLACK} size={25} />} onPress={() => navigation.openDrawer()} /> ); } 요렇게 되어있는데 넘겨받는 파라미터랑 넘겨주는 쪽이 맞지않아서... 그런거 같은데.. 강의 6강 듣고있는 중이구요... 도저히 해결이 안되서 질문드립니다. 무엇이 잘못된걸까요?? 선생님 github 소스내려받아도 저는 navigation 저부분이 계속 빨간줄 쳐지면서 에러가 발생합니다.. 새해 복 많이 받으세요.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
sevenfingersstudio 댓글 3 좋아요 0 조회수 154

iOS세팅 및 pod install오류

미해결

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

https://www.inflearn.com/community/questions/1500441/ios오류-pod-install오류 여기서 질문을 드렸던 학생입니다! 그때 강사님께 답변을 받고 시도해 보았으나 동일한 혹은 비슷한 오류들로 인해 여전히 ios설정을 하지 못하고있습니다 도와주시면 감사하겠습니다 .. ㅠㅠ arch -x86_64 pod install --repo-update는 인텔 맥에서 사용하는 명령어라해서 pod install --repo-update를 사용하였습니다. (m4 pro칩 맥북입니다.) 하지만 동일하게 오류가 발생하였습니다..ㅠㅠ pod install이 실행되지않아 xcworkspace 파일이 생기질 않아 그 이후로는 따라 진행을 하지 못했습니다. 저기 오류에 나와있는대로 sha256 값도 오류 내용대로 바꿔보았고 동일하게 진행이 되지 않았습니다 pod update 나 캐시 삭제 등 해볼수있는걸 다. 진행해 봣으나 계속 동일한 곳에서 동일한 에러만 발생하여 너무 막막합니다. 해결방법이 없을까요?.. 아 그리고 그냥 만들어본 리엑트 네이티브 최신버전 파일에서는 ios빌드가 그냥 되긴했었습니다. 하지만 강의 프로젝트는 이미 0.72.6버전으로 만들어 진행을 하고있고 강의를 보며 졸업작품을 만들고있는 다른 프로그램 또한 동일한 0.72.6버전으로 만들고있어 해결이 되면 진짜 너무너무 감사하겠습니다.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
kjm010629 댓글 1 좋아요 0 조회수 321

Streaming을 사용하지 않아도 미리 정적인 컴포넌트들을 서버에서 응답을 받습니다

미해결

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

loading.tsx나 Suspense를 사용했을 때, Next의 Streaming이 동작하여 병렬적으로 미리 준비된 컴포넌트는 사용자의 브라우저에서 먼저 보이게 되고, fetch가 완료된 이후에 서버에서 데이터를 클라이언트로 보내줘서 사용자가 보이는걸로 알고 있습니다. 하지만, 개발자 도구 Network 탭을 확인해본결과 새로고침을 하였을 때, loading.tsx나 Suspense를 사용을 모두 빼고서 prefetchQuery와 HydrationBoundary, useQuery만을 사용했을 시 Streaming 동작 방식처럼 fetch문 실행이 완료되기 전에 미리 NavMenu나 글자 같이 정적인 요소들이 fetch가 끝나기 전에 이미 브라우저에 도착해있는걸 확인하였습니다. 하지만, 딱 한가지 다른 점은 후자 같은 경우는 정적인 컴포넌트가 브라우저에 도착했음에도 화면에 보이질 않고, 전자 같은 경우는 로딩창이나 다른 정적인 요소들은 이미 화면에 미리 보입니다. 그렇다면, Next 15 공식문서에 있는 fetch 실행이 끝날때까지 HTML 파일을 서버 사이드에서 렌더링 하는 것이 Blocking 된다는 논리가 이해가 되질 않습니다. ( https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming ) 위의 코드는 /home의 추천탭을 기준으로 확인하였습니다. 이러한 현상이 발생하는 원인이 무엇인지 알 수 있을까요?

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

useAuth 401 error

미해결

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

일단 윈도우유저입니다. 코드는 강사님 코드 그대로라.. 뭐 보여드릴게없습니다. 3-8 듣고있습니다. 에러같은경우는 401에러 axios error입니다. 이상한게 onSuccess가 계속 실행이 안되는데 onSettled은 또 실행이되고.. 확인을해보니 백엔드에서 문제가 있는것같습니다. 백엔드에서 확인을해보니 autoguard에 막히는것같아서 일단 지워보고 진행을햇는데도 id가없다고합니다 autoguard를 못뚫으니 토큰문제같기는한데.. 궁금합니다.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
정근혁 댓글 1 좋아요 0 조회수 192

인터셉팅 라우팅 적용 도중 무한 새로고침(리디렉션)이 되는 원인이 궁금합니다.

미해결

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

안녕하세요. 강의 잘 시청중입니다. 진행 하고있던 도중 궁금한게 생겼습니다. 섹션2 - 로그인 모달에서 발생하는 문제 해결하기(router.replace) 4:06 경에 개발자 도구쪽을 보면 x개수가 빠르게 늘어나는것을 보실 수 있을텐데, 제 기준에서는 저 때 무한 새로고침이 되고있더라구요. next.js콘솔에서는 GET 요청으로 /i/flow/login이 계속 되고있고 제가 직접 새로고침을 하거나 페이지를 벗어나면 멈추는데, 저 뒤로 강의 내용에 맞게 useRouter를 사용하면 문제는 없지만 저런 현상이 벌어진 이유가 궁금합니다. 혼자서 이것저것 바꿔가면서 해봤는데 /login -> redirect -> (인터셉팅 라우트)/i/flow/login 형태만 되면 계속 새로고침 되는 이유를 도무지 모르겠는데 원인이 너무 궁금해요

  • react
  • next.js
  • react-query
  • next-auth
  • msw
원준 댓글 2 좋아요 0 조회수 333

pdgadmin 이상해요

미해결

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

일단 만들지도 않은 postgresql 17서버가 자꾸생기구요. 만들떄 비밀번호 치명적오류가 나오는데 username을 또 안바꾸면 잘만들어집니다 . 이해가안되서요.. 그러면 앞으로도 계쏙 username을 못바꾸고써하는건지 일단 윈도우입니다.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
정근혁 댓글 2 좋아요 0 조회수 121

SSR prefetchQuery를 사용하는데 왜 UserInfo에서 데이터를 한번 더 가져오는지 모르겠습니다,,,

미해결

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

안녕하세요! 강의 수강 중 헷갈리는 게 있어 질문 드립니다!! 다름이아니라, 강의 초반에 프로필 페이지가 SSR인 것과 prefetchQuery를 사용하는 것에 이해를 했는데, 왜 하위 컴포넌트인 UserInfo에서 다시 userQuery를 통해 데이터를 가져오는지 모르겠습니다! 서버사이드 환경인 page.tsx에서 데이터를 가져오기 위해 PrefetchQuery를 사용하는 것으로 알고있는데, 그렇다면 UserInfo에서 useQuery를 통해 데이터를 가져오는 것이 아닌 데이터를 props로 넘겨줄 수 있는게 아닌가 싶습니다! 혹시 최상위 page에서 prefetchQuery를 통해 데이터를 먼저 가져와야 그 하위 컴포넌트들 내부의 클라이언트 컴포넌트에서 useQuery를 통해 데이터를 가져올 수 있는건가요? 그렇다면 prefetchQuery없이 클라이언트 컴포넌트에서 userQuery만 사용해도 되나요?

  • react
  • next.js
  • react-query
  • next-auth
  • msw
amh6281 댓글 2 좋아요 0 조회수 204

Stack.navigator오류가 있어요

미해결

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

똑같이 해도 어떨떄는 문제가 있다고 하고 어떨떄는 문제가없다고 하는데 [{ "resource": "/c:/Porject/ReactNative/pr/acliet/src/app/stack/AuthStackNavigator.tsx", "owner": "typescript", "code": "2741", "severity": 8, "message": "Property 'id' is missing in type '{ children: Element[]; }' but required in type '{ id: undefined; }'.", "source": "ts", "startLineNumber": 17, "startColumn": 6, "endLineNumber": 17, "endColumn": 21, "relatedInformation": [ { "startLineNumber": 63, "startColumn": 5, "endLineNumber": 63, "endColumn": 7, "message": "'id' is declared here.", "resource": "/c:/Porject/ReactNative/pr/acliet/node_modules/@react-navigation/core/lib/typescript/module/src/types.d.ts" } ] }] 오류로 id가 없다고 하네요 import React from 'react'; import {createStackNavigator} from '@react-navigation/stack'; import AuthHomeScreen from '../../pages/AuthHomeScreen'; import LoginHomeScreen from '../../pages/LoginHomeScreen'; import SignupHomeScreen from '../../pages/SignupHomeScreen'; import {authNavigator} from '../../config/AuthNavigator'; export type AuthStackParams = { [authNavigator.AUTH_HOME]: undefined; [authNavigator.LOGIN]: undefined; [authNavigator.SIGNUP]: undefined; }; const Stack = createStackNavigator<AuthStackParams>(); const AuthStackNavigator = () => { return ( <Stack.Navigator> <Stack.Screen name={authNavigator.AUTH_HOME} component={AuthHomeScreen} /> <Stack.Screen name={authNavigator.LOGIN} component={LoginHomeScreen} /> <Stack.Screen name={authNavigator.SIGNUP} component={SignupHomeScreen} /> </Stack.Navigator> ); }; export default AuthStackNavigator; 대한 정보가 없을경우 답변이 어렵습니다.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
정근혁 댓글 1 좋아요 0 조회수 177

iOS오류 pod install오류

미해결

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

pod install 이든 npc pod install이든 계속 저 installing boost쪽에서 에러가 뜹니다 윈도우 pc에서 만들던 프로젝트 맥북을 구매하게 되어 맥북으로 하고있는데 안드로이드 에뮬레이터는 npx react-native run-android를 이용해 동일하게 잘 되는데 ios는 되지 않아 막막합니다 어떻게 해결해야 할까요?? npx react-native run-ios 를 했을시 나오는 오류입니다 도와주시면 감사하겠습니다! https://github.com/boostorg/boost/issues/843#issuecomment-1872943124 이것도 참고해봣지만 해결되지않았습니다 ios가 하고싶은데 너무 절실해서 부탁드릴게요 ㅠㅠ

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
kjm010629 댓글 4 좋아요 0 조회수 343

✖ Installing CocoaPods dependencies (this may take a few minutes) error bundler: failed to load command: pod

미해결

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

기존에 윈도우pc로 하다가 그램 노트북으로 작업하려고하니 돌아가질 않아 맥북프로를 사서 세팅을 다시하고 프로젝트를 만들어보고있는데 5시간넘게 저기서 해결이 되지않아 너무 답답해 해결방법을 알고싶습니다. 또한 기존에 윈도우pc에서 만들던 프로젝트들은 윈도우이기 때문에 강사님이 중간중간에 pod install하라고하는 이런것들을 하지않았는데 혹시 만들던 프로젝트는 사용하지 못하는 것인가요??.. ㅠㅠ 도무지 검색하고 찾아봐도 해결이 되지않아 꼭 도와주시면 감사하겠습니다 버전 정보입니다. 제발 도와주시면 감사하겠습니다 ㅠㅠ

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
kjm010629 댓글 7 좋아요 0 조회수 538

빨간 밑줄 질문이요..

미해결

React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지

위와 같이 해당 변수나 값을 선언한거를 사용하지 않으면 이렇게 빨간 밑줄이 생기는데요. 이거 없앨수 없나요? 거슬리네요..ㅠ

  • react
  • React-Context
  • react-router
  • tailwindcss
  • react-query
eventures111 댓글 2 좋아요 0 조회수 170

인기 태그

인프런 TOP Writers

주간 인기글