inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

맥북이 아니고 윈도우 사용자 질문있습니다!!! (급해요)

해결됨

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

맥북을 사용하지 않고 윈도우를 사용하고 있습니다 강의 중 섹션 2에서 윈도우사용자면 1-2,1-3,1-5 듣지 않고 1-4만 듣고 2-0으로 넘어가면 될까요??

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

QueryClient 에서 retry 를 false 로 설정하신 이유

해결됨

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

3-8 강의 1:04 에서, QueryClient 의 retry 옵션을 false 로 설정하신 특별한 이유가 있으신가요? 왜 이렇게 설정한지 궁금합니다.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
Ryan Kim 댓글 1 좋아요 1 조회수 222

백엔드에 요청을 보내면 Network Error가 발생합니다

해결됨

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

안녕하세요. 지금 강의 3-8을 들으면서 회원가입, 로그인 요청을 보내는 코드를 작성 중입니다. 다름아니라 회원가입 등 백엔드에 요청을 보내면 백엔드 서버까지 요청이 전달되지 못하고 network error를 반환합니다. 소스코드는 다음과 같습니다 // auth.ts const postSignup = async ({email, password}: RequestUser): Promise<void> => { try{ const {data} = await axiosInstance.post('/auth/signup', { email, password, }); return data; } catch (error) { console.error(error); } }; // axios.ts import axios from 'axios'; const axiosInstance = axios.create({ baseURL: 'http://localhost:3030', withCredentials: true, }); export default axiosInstance; 백엔드와 DB연결이 잘못되어있나 싶어서 postman으로 요청을 보내니 그 요청은 잘 전달되어 DB에 user가 생성됩니다. 그리고, 강의 3-8의 소스코드를 그대로 가져와 서버를 켜고 요청을 보내니 여전히 network error가 발생합니다. 어디서 실수를 해서 에러가 나는 것일까요?

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

빈 프로젝트 생성

해결됨

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

❗ 질문 작성시 꼭 참고해주세요 최대한 상세히 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다. 맥/윈도우, 안드로이드/iOS, ReactNative 버전 등의 개발환경 도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. (일부만 잘라서 올리지 말아주세요.) 프로젝트 생성 시 빈 프로젝트만 생성되고 안에 폴더 내부는 비어있는데 혹시 어떤 문제일까요

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

Sending 'onAnimatedValueUpdate with no listeners registered. 오류

해결됨

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

안녕하세요 강사님 아래 같이 오류가 발생하는데 해결방법이 있을까요..? 감사합니다

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
강프로그래머 댓글 1 좋아요 0 조회수 247

환경 설정 및 프로젝트 생성에서 오류가 납니다.

해결됨

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

구글링해서 찾은 방법과 GPT에서 찾은 방법으로는 해결이 안되고 있어요. brew update를 해도 안되고 watchman으로 하는 해결방법도 안됩니다. Gpt는 파일이 많아서 제한 수를 늘리는 해결방안을 주는데 그것도 안되고 있습니다! 어떻게 해야할까요? 참고로 처음에 강사님이 말씀하신 버전대로 깔아서 셋팅했을 때 저 오류가 계속 떠서 이번에는 다 최신 버전으로 바꿔서 해보았는데도 똑같은 오류가 발생합니다.

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
GPT CHAT 댓글 1 좋아요 0 조회수 184

선생님 강의를 따라가려면 함수형 프로그래밍을 배워야 하나요?

해결됨

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

선생님 코드의 로직이 어렵게 느껴져 따라가는데 어려움을 겪고 있습니다. chatgpt를 활용해보니, 함수형 프로그래밍을 공부하면 된다고 하는데요. 혹시 먼저 함수형을 공부하고 다시 선생님 강의에 도전을 하는게 맞는 순서일까요?

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
박상원 댓글 3 좋아요 1 조회수 281

선생님 죄송한대

해결됨

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

Supabase, Next 풀 스택 시작하기 (feat. 슈파베이스 OAuth, nextjs 14) 강의쿠폰 더 없을까요 ㅠㅠ 너무 늦게알았네요 ㅠㅠ

  • react
  • 인터랙티브-웹
  • 클론코딩
  • next.js
  • tailwind-css
  • zustand
foxball 댓글 1 좋아요 1 조회수 175

RN expo 에 대하여

해결됨

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

안녕하세요. 현업자로서 RN expo에 대한 강사님의 생각이 궁금합니다. RN 공식 페이지에서 expo 와 같은 프레임 워크 사용을 권장하는 뉘앙스로 설명을 시작하는데 , ( You can also use React Native without a Framework, however we’ve found that most developers benefit from using a React Native Framework like Expo .) 만약 강사님이 완전 새로운 앱 개발에 착수하신다면, expo 를 사용하실것 같으신가요? 아니면 native cli 로 시작하실것 같으신가요?

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
Ryan Kim 댓글 2 좋아요 1 조회수 259

윈도우/안드로이드 Ninja를 설치해야하나요?

해결됨

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

윈도우 안드로이드 보고있는데 잘 되다가 stack Navigation 공식문서보고 인스톨하고 코드추가 한 후에 yarn start 하고 a 하면 [CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders. [CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders. FAILURE: Build failed with an exception. * What went wrong: A problem occurred configuring project ':react-native-screens'. > [CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders. * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. * Get more help at h ttps://help.gradle.org 라고 나옵니다

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

깃 push가 안되서 ssh를 한참해메고 있습니다. ㅠㅠ

해결됨

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

The authenticity of host ' github.com (20.200.245.247)' can't be established. ED25519 key fingerprint is SHA256:+DiY3wvvV 위와같은 문구가 뜨고 안되네요. ㅠㅠ

  • react
  • 인터랙티브-웹
  • 클론코딩
  • next.js
  • tailwind-css
  • zustand
foxball 댓글 1 좋아요 1 조회수 182

Drawer Navigation 적용 후 발생하는 오류

해결됨

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

isLoggedIn이 false일 때는 Auth네비게이터를 보여주고 이 때는 별 다른 오류가 발생하지 않습니다. 하지만 isLoggedIn을 true로 변경 한 후, Drawer 네비게이터를 보여줄 때는 위와 같은 오류가 계속 발생합니다. 어디서 타입 에러가 발생하는건지 도저히 모르겠어서 질문을 남깁니다... cf) babel 파일 수정, 캐시 삭제 후 재실행, 안드로이드 에뮬레이터 cold boot 다 시도해봤는데 동일한 문제가 계속 발생합니다. import {createDrawerNavigator} from '@react-navigation/drawer'; import React from 'react'; import MapHomeScreen from '../../screens/MapHomeScreen'; import FeedHomeScreen from '../../screens/FeedHomeScreen'; import CalendarHomeScreen from '../../screens/CalendarHomeScreen'; const Drawer = createDrawerNavigator(); const MainDrawerNavigator = () => { return ( <Drawer.Navigator> <Drawer.Screen name="MapHome" component={MapHomeScreen} /> <Drawer.Screen name="FeedHome" component={FeedHomeScreen} /> <Drawer.Screen name="CalendarHome" component={CalendarHomeScreen} /> </Drawer.Navigator> ); }; export default MainDrawerNavigator; import React from 'react'; import {View, Text} from 'react-native'; interface MapHomeScreenProps {} const MapHomeScreen = ({}: MapHomeScreenProps) => { return ( <View> <Text>MapHomeScreen</Text> </View> ); }; export default MapHomeScreen;

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
khj031295 댓글 1 좋아요 1 조회수 336

MAC OS, 윈도우

해결됨

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

MAC에서 작성한 코드를 윈도우 환경에서 돌려도 문제가 없을까요?? 서로 환경이 다른 곳에서 작성된 코드들이 문제없이 작동하는지 궁금합니다.

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

Chapter 7 영상 화면이 안보입니다.

해결됨

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

Chapter 7 (섹션 8) 가장 첫 번째 강의는 보이는데 이후부터는 강의 영상이 나오지가 않네요

  • react
  • 인터랙티브-웹
  • 클론코딩
  • next.js
  • tailwind-css
  • zustand
댓글 2 좋아요 0 조회수 291

Presigned URL 방식

해결됨

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

강사님이 알려주신 방식을 듣고 다양한 이미지 처리 방식을 공부하기 위하여 Presigned URL 방식을 구현중에 있습니다. Nest.js 백엔드에 요청을 통해 발급받은 S3 url 주소에 RN환경에서 PUT 요청으로 이미지를 업로드하고 있습니다. 이 떄, 일반적인 form-data 형식은 들어가지지 않는 것 같은데, binary 형태는 매우 잘 들어가집니다. 현업에서도 presigned-url을 활용할 떄 binary 형태로만 전달을 해야하나요, 아니면 다른 방식이 있는지 알고 싶어 식견을 구하고자, 질문드립니다!! 또, RN에서 Binary 형태를 만드는 방법이 쉽지 않아보여, 어떻게 하는게 좋은 방식인지 알고싶습니다!

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
김용민 댓글 2 좋아요 0 조회수 223

gradle 오류

해결됨

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

윈도우 amd 안드로이드 환경입니다 react-native doctor를 했을땐 이상이 없는데 npm start 했을 때 Gradle could not start your build. Could not create service of type ChecksumService using BuildSessionScopeServices.createChecksumService(). java.i o.FileNotFoundException: C:\Users\project\MatzipApp\android.gradle\8.0.1\checksums\checksums.lock (�׼����� �źεǾ����ϴ�) 이런 오류가 자꾸 뜹니다

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
권태주 댓글 2 좋아요 0 조회수 310

템플릿 리터럴 오류 질문

해결됨

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

윈도우, 안드로이드 환경입니다. import React from 'react'; import {Pressable, StyleSheet, Text} from 'react-native'; interface CustomButtonProps{ label: string; variant?: 'filled' | 'outlined'; size?: 'large' | 'medium'; } function CustomButton({ label, variant='filled', size='large', }: CustomButtonProps) { return ( <Pressable style={[styles.container, styles[variant], styles[size]]}> <Text style={[styles.text, styles['${variant}Text']]}>{label}</Text> </Pressable> ) } const styles = StyleSheet.create({ container:{ borderRadius: 3, justifyContent:'center', }, filled: { backgroundColor:'#C63B64' }, outlined: { borderColor:'C63B64', borderWidth: 1, }, large: { width: '100%', paddingVertical: 15, alignItems: 'center', justifyContent: 'center', }, medium: { width: '50%', paddingVertical: 12, alignItems: 'center', justifyContent: 'center', }, text: { fontSize: 16, fontWeight: '700', }, filledText: { color: 'white', }, outlinedText: { color: '#C63B64', }, }); export default CustomButton; styles['${variant}Text' ]이 부분이 에러가 발생하는데 왜그런 것인가요? 에러메세지는 다음과 같습니다. [{ "resource": "/c:/Users/dcgn6ec/MatzipApp/front/src/components/CustomButton.tsx", "owner": "typescript", "code": "7053", "severity": 8, "message": "Element implicitly has an 'any' type because expression of type '\"${variant}Text\"' can't be used to index type '{ container: { borderRadius: number; justifyContent: \"center\"; }; filled: { backgroundColor: string; }; outlined: { borderColor: string; borderWidth: number; }; large: { width: \"100%\"; paddingVertical: number; alignItems: \"center\"; justifyContent: \"center\"; }; medium: { ...; }; text: { ...; }; filledText: { ...; }; ...'.\n Property '${variant}Text' does not exist on type '{ container: { borderRadius: number; justifyContent: \"center\"; }; filled: { backgroundColor: string; }; outlined: { borderColor: string; borderWidth: number; }; large: { width: \"100%\"; paddingVertical: number; alignItems: \"center\"; justifyContent: \"center\"; }; medium: { ...; }; text: { ...; }; filledText: { ...; }; ...'.", "source": "ts", "startLineNumber": 18, "startColumn": 36, "endLineNumber": 18, "endColumn": 60 }]

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

오류발생 문제입니다.

해결됨

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

import { IoPlaySkipBackSharp, IoPlaySkipForwardSharp } from "react-icons/io5"; import { PlayerSlider } from "../ui/PlayerSlider"; import { useAudio } from "react-use"; import { AiOutlinePause } from "react-icons/ai"; import { usePlayerState } from "@/hooks/usePlayerState"; import { ClipLoader } from "react-spinners"; import { RiPlayFill } from "react-icons/ri"; export default function PlayerContent() { const { activeSong } = usePlayerState(); const [audio, state, controls, ref] = useAudio({ src: activeSong?.src ?? "", autoPlay: true, }); const isLoading = activeSong?.src && state.buffered?.length === 0; console.log("로딩상태:", isLoading); const onClickPreBtn = () => {}; const onClickStartBtn = () => { controls.play(); console.log("start일때 로딩상태:", isLoading); }; const onClickPauseBtn = () => { controls.pause(); console.log("pause일때 로딩상태:", isLoading); }; const onClickNextBtn = () => {}; return ( <div className="w-full h-full relative"> <div className="absolute top-[-16px] w-full"> <PlayerSlider className="w-full" defaultValue={[0]} value={[state.time]} onValueChange={(value) => { controls.seek(value); }} /> </div> {audio} <section className="flex flex-row justify-between items-center w-full h-full px-2 lg:px-6"> <div className="flex flex-row items-center h-full gap-1 lg:gap-8"> <IoPlaySkipBackSharp size={40} className="cursor-pointer" onClick={onClickPreBtn} /> {isLoading ? ( <ClipLoader color="#FFF" /> ) : state.playing ? ( <AiOutlinePause size={40} className="cursor-pointer" onClick={onClickPauseBtn} /> ) : ( <RiPlayFill size={40} className="cursor-pointer" onClick={onClickStartBtn} /> )} <IoPlaySkipForwardSharp size={40} className="cursor-pointer" onClick={onClickNextBtn} /> </div> <article></article> <div></div> </section> </div> ); } playerContent.tsx 파일인데 무한로딩이 계속 생겨서 UI만 뱅글뱅글 돌아가네요.. 그리고 thumb도 조절이 안되요.. 어디가 잘못된지 모르겠네요 1시간째 찾고있는데 ㅠㅠ 저는 모든 파일을 jsx가 아닌 tsx로 해서 어딘가에 문제가 있는것 같은데 못찾겠습니다.

  • react
  • 인터랙티브-웹
  • 클론코딩
  • next.js
  • tailwind-css
  • zustand
Eunwoo 댓글 1 좋아요 1 조회수 263

질문있습니다.

해결됨

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

각 페이지마다 loading과 error.tsx를 각각 주고 있는데 그냥 root에 loading.tsx error.tsx를 하나만 둬서 공유하는 방식은 안되나요? 각 페이지마다 따로 둔 이유가 뭔가요? 현업에서도 layout은 보통 page마다 다르게 두나요? 이전에는 프로젝트에서 그냥 root에 위치한 하나의 layout만 써와서.. 강의 잘 보고있습니다. 선생님!

  • react
  • 인터랙티브-웹
  • 클론코딩
  • next.js
  • tailwind-css
  • zustand
Eunwoo 댓글 1 좋아요 1 조회수 214

[3-2] // deviceHeight 분기점이 700인 이유가 있나요?

해결됨

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

deviceHeight > 700 ? .. : .. 강사님께서 700을 분기점으로 잡으셨는데요. 혹시 700인 이유가 있는걸까요? 아니면 700이라는 수치는 의미가 없고, 분기가 가능하다는 걸 가르쳐주시려는 의도인건가요?

  • react-native
  • typescript
  • nestjs
  • react-query
  • zustand
박상원 댓글 1 좋아요 0 조회수 193

인기 태그

인프런 TOP Writers

주간 인기글