묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결핸즈온 리액트 네이티브
로그인 에러 출력시 default값만 나옵니다.
로그인 에러 처리시 email 형식이 잘못된거와 default값만 출력이 됩니다. 다른분이 올리신 이전 질문글을 바탕으로(https://inf.run/mR9EP)firebase.js도 수정해보았는데 변화는 없었습니다. 수정하여 올려주신 코드에서import { getReactNativePersistence, initializeAuth } from 'firebase/auth/react-native';로 할 시iOS Bundling failed 1456ms index.js (926 modules)Unable to resolve "firebase/auth/react-native" from "src\api\firebase.js"이런 오류가 발생해서 아래의 코드로 작성했습니다.import { getReactNativePersistence, initializeAuth } from 'firebase/auth'; 아이디와 비밀번호를 가져오는 부분에서 firebase쪽과 문제가 있는거 같은데 어떤부분이 문제인지 궁금해서 질문드립니다! 깃 주소는https://github.com/dvrakry/rn-photo2입니다.
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
travel seller가 캐싱되지 않습니다.
fetchTravelproducts에서 클릭으로 상세 페이지로 들어가면 fetchTravelproduct 의 data 값을 보여주는데API 요청에서 data 값을 확인하면 seller 값이 들어있는데 data.fetchTravelproduct.seller를 콘솔에 찍으면 null 이 뜹니다. (다른 데이터는 정상적으로 불러옵니다.) fetchTravelproducts에서는 판매자 이름이 잘 출력이 되는데 상세페이지에 들어가면 해당 fetchTravelproduct API 요청으로 가져와도 판매자 데이터가 없는 상태로 뜨는데 문제가 뭘까요?여기서 상세페이지에서 새로고침을 하면 정상적으로 판매자가 보여집니다. fetchTravelproducts에서 캐싱하는 과정에 문제가 있는 걸 까요? // 상세 페이지 import { Query } from "@/entities/api/graphql"; import { gql, useQuery } from "@apollo/client"; export const TRAVEL_PRODUCT = gql` query fetchTravelproduct($travelproductId: ID!) { fetchTravelproduct(travelproductId: $travelproductId) { _id name remarks contents price tags images pickedCount travelproductAddress { zipcode address addressDetail lat lng } seller { _id name picture } createdAt } } `; export const useFetchTravelProduct = ({ travelId }: { travelId: string }) => { const result = useQuery<Pick<Query, "fetchTravelproduct">>(TRAVEL_PRODUCT, { variables: { travelproductId: travelId }, }); return result; };// 목록 페이지 import { Query } from "@/entities/api/graphql"; import { gql, useQuery } from "@apollo/client"; const TRAVEL_PRODUCTS = gql` query fetchTravelproducts($isSoldout: Boolean, $search: String, $page: Int) { fetchTravelproducts(isSoldout: $isSoldout, search: $search, page: $page) { _id name remarks contents price tags images pickedCount travelproductAddress { zipcode address addressDetail lat lng } buyer { _id name picture } seller { _id name picture } createdAt } } `; interface UseFetchTravelProductsArgs { isSoldout: boolean; search: string | null; page: number; } export const useFetchTravelProducts = ({ isSoldout, search, page, }: UseFetchTravelProductsArgs) => { const result = useQuery<Pick<Query, "fetchTravelproducts">>(TRAVEL_PRODUCTS, { variables: { isSoldout, search, page, }, }); return result; };
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
js 핸드폰 인증번호 구현
여기서 time=time-1 붙였는데시간1초씩줄어드는거 적용이 안되요 도와주세요 ㅠㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
Js 문자열 헷갈립니다ㅠ
js 공부중인데 여기서 aa 와 "aa"결과값이 다르게 나오는데 1.이유가 뭔가요? 2.둘 차이점이 뭔가요?자세하게 부탁드립니다 ㅠㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
노션에서 즐겨찾기가 안됩니다.
수업 노트 보기에서 노션에 들어가면 따로 즐겨찾기를 할 수 있는 기능이 없는데 어떻게 해야 되나요?
-
미해결핸즈온 리액트 네이티브
안드로이드 기기에서 SignUp 화면 관련 질문드립니다.
안드로이드 기기에서 SignUp 화면에서 키보드를 킬 시 아래 SIGNIN 버튼이 안보이는 문제 발생해서 질문드립니다. IOS 기기에서는 키보드를 생성해도 아래 SignIn 버튼이 보이는데 안드로이드에서는 signIn 버튼이 보이지 않아서 질문드립니다.스크롤바를 내려서 HR 라인까지밖에 내려가지가 않습니다! 깃허브 주소는 : https://github.com/dvrakry/rn-photo2입니다 감사합니다!
-
미해결핸즈온 리액트 네이티브
간단한 질문 하나만 드리겠습니다!
const [isLoading, setIsLoading] = useState(false); const [disabled, setDisabled] = useState(true); !disabled && !isLoading!disabled || !isLoading 위에 이 두가지의 차이 점을 잘 구별을 못하겠어서 질문을 드립니다.=======================밑에 AI 설명으로 이해했습니다 . 감사합니다!
-
미해결핸즈온 리액트 네이티브
text.trim() 부분에서 오류가 발생합니다.
할일을 입력시 오류가 발생해서 질문드립니다. (NOBRIDGE) ERROR TypeError: text.trim is not a function (it is undefined) 깃주소는 : https://inf.run/6Thdc 입니다. 감사합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
수업내용의문
안녕하세요 [CSS 09-2-3] 폰트 - 폰트와 크로스브라우징 강의 마지막에 다음강의에 안내된 그림,차트 모달 관련 강의가 없습니다.섹션 09 => [JS 09-1-1] 수업내용이 [ CSS 09-1-1] 과 같습니다. 중복업로드된것이 아닌지요 ?
-
해결됨[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
Mac Os / npx eas build --platform android --profile development 질문
Vscode 터미널에서 npx eas build --platform android --profile development 명령어를 입력하면Resolved "development" environment for the build. Learn moreNo environment variables with visibility "Plain text" and "Sensitive" found for the "development" environment on EAS.✔ Using remote Android credentials (Expo server)✔ Using Keystore from configuration: Build Credentials B93ecKpj4X (default)Compressing project files and uploading to EAS Build. Learn more✖ Compressing project filesFailed to upload the project tarball to EAS BuildReason: EPERM: operation not permitted, scandir '/Users/development/.Trash' Error: build command failed.GPT는 Trash를 우회해서 하라는데 우회해도 안되고.. .easignore 파일에 .Trash.DS_Storenode_modules.git**/.Trash!./.Trash # 만약 현재 디렉토리에 있다면 포함시킴를 작성해도 계속 같은 에러가 발생합니다ㅠ.ㅠ어떻게 해결하면 될까요 ?
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
cocoapods 설치 오류 관련
이슈React Native 프로젝트 생성 시 CocoaPods 오류 sudo gem uninstall cocoapods 실행 시 cocoapods 설치 안됐다는 메시지 확인 그래서 sudo gem install cocoapods, gem install cocoapods 명령어를 통해 cocoapods 수차례 재설치 및 관련 패키지 (drb, activesupport 등) 설치했음에도 안됨Xcode 상 Location, Command Line Toolds 도 확인zshrc 파일 내에도 말씀하신대로 명령어 입력해놓음 -> 후 프로젝트 생성 자체가 안되서 진도를 못나가서 너무 해결하고 싶은데 어떻게 해야할까요? 개발중인 OS 등의 버전Mac OS: 15.3.2(24D81)ReactNative: 0.72.6(으로 생성하라고 하셔서 버전 명시하여 프로젝트 생성하였으나 실패)Node: v23.10.0Ruby: ruby 2.7.6p219 (2022-04-12 revision c9c2245c0a) [arm64-darwin24] rbenv: 1.3.2
-
해결됨아바타 커뮤니티앱 만들기 (React Native Expo)
useGetMe 함수 관련 질문
❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다.에러 잘라서 올리시면 안됩니다!(에러 일부만 자르거나 일부만 복사하지말아주세요) useGetMe 함수 만드실 때, useQuery 옵션으로 onSuccess, onError 사용 안하시고, useEffect로 사이드 이펙트를 처리하시는 이유가 궁금합니다!
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
폰트 적용 관련 오류
한번씩 폰트 적용이 안되는데새로고침을 하면 적용이 됩니다. 혹시 관련해서 해결 방법이 정리된게 있을까 해서 글 올려봅니다!
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
싸이월드: Background 이미지 반복
싸이월드 백그라운드를 만드는 중인데 이미지가 이렇게 반복되는건 어떻게 고치나요? AI로 고치려고 해도 안고쳐지네요..감사합니다
-
미해결따라하며 배우는 리액트 네이티브 기초
getStatusBarHeight () 화면UI적용
getStatusBarHeight의 값이 콘솔에 찍히는데 그 값이 화면에 적용되지 않습니다. import { View, StyleSheet, StatusBar, Image, Text, TouchableOpacity, Animated, Platform, } from 'react-native'; import {getStatusBarHeight} from 'react-native-status-bar-height'; import React, {useEffect, useRef} from 'react'; import {SafeAreaView} from 'react-native-safe-area-context'; import Ionic from 'react-native-vector-icons/Ionicons'; const Status = ({route, navigation}) => { const {name, image} = route.params; const statusBarHeight = getStatusBarHeight(); const topMargin = Platform.OS === 'ios' ? statusBarHeight : 0; console.log('statusBarHeight', statusBarHeight); console.log('topMargin', topMargin); // Animated.Value(0)의 값을 직접 변경하면 안되기 때문에 useRef를 사용 const progress = useRef(new Animated.Value(0)).current; const progressAnimation = progress.interpolate({ inputRange: [0, 5], outputRange: ['0%', '100%'], }); useEffect(() => { Animated.timing(progress, { toValue: 5, duration: 5000, useNativeDriver: false, }).start(); }); useEffect(() => { let timer = setTimeout(() => { navigation.goBack(); }, 5000); return () => { clearTimeout(timer); }; }); return ( <SafeAreaView style={styles.statusContainer}> <StatusBar barStyle="light-content" backgroundColor="black" /> <View style={[styles.topGreyLineContatiner, {top: 18 + topMargin}]}> <Animated.View style={{ backgroundColor: 'white', height: '100%', width: progressAnimation, }} /> </View> <View style={[styles.headerContainer, {top: 12 + topMargin}]}> {* ... /*} </View> <Image style={styles.storyImage} source={image} /> </SafeAreaView> ); }; export default Status; const styles = StyleSheet.create({ statusContainer: { backgroundColor: 'black', height: '100%', justifyContent: 'center', }, topGreyLineContatiner: { height: 3, width: '95%', borderWidth: 1, backgroundColor: 'grey', position: 'absolute', }, headerContainer: { padding: 15, flexDirection: 'row', alignItems: 'center', position: 'absolute', top: 12, left: 0, width: '90%', }, headerImageContainer: { width: 30, height: 30, justifyContent: 'center', alignItems: 'center', }, //.... }); console.log('statusBarHeight', statusBarHeight); console.log('topMargin', topMargin);이렇게 했을경우 statusBarHeight 20 , topMargin 20값이 모두 정상적으로 디버깅 툴에 출력됩니다. 그러나 화면상에 ui에 적용되지 않아요.일부로 const 에 넣어서 사용해봤고, margintTop과 top이 같이 있을경우 가끔 문제가 된다는 글을 봐서 아예 top에 값을 따로 추가하는 방식도 해보았습니다. 그리고 마지막으로 예제 코드를 그대로 가져와서 사용해보았지만 여전히 화면에서 적용이 되지 않습니다. 값이 찍히는 걸 보면 getStatusBarHeight가 동작하긴 하는건데 화면상에서 적용이 안되는 이유가 뭔지 알 수 있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
koreanjson 문제
안녕하세요 수업따라고 하고 있는중에,인터넷이 잘 연결되어 있는데 koreanjson.com 이 웹브라우저에서 열리지 않습니다.
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
yarn add @react-navigation/native 설치 후 환경 에러
yarn add @react-navigation/native 설치 이후 부터 java 버전이 다르다고 나와서몇일째 진도를 못나가고 있습니다. 제발 도와주세요... Task :react-native-safe-area-context:compileDebugKotlin'compileDebugJavaWithJavac' task (current target is 11) and 'compileDebugKotlin' task (current target is 17) jvm target compatibility should be set to the same Java version.
-
해결됨[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
koreanjson.com 사이트가 안열려요..
강의 수강중인데 koreanjson.com 참고사이트가 사이트에 연결할 수 없음이라고 뜨네요 다른 방법이 있을까요?
-
해결됨아바타 커뮤니티앱 만들기 (React Native Expo)
app/_layout.tsx에서 useEffect 구간 의미
혹시 app/_layout.tsx 파일에서 아래 부분 의미가 뭘까요...? useEffect(() => { if (loaded) { SplashScreen.hideAsync(); } }, [loaded]); if (!loaded) { return null; }
-
미해결
TypeError: Cannot read property 'bubblingEventTypes' of null
react-native 프로젝트 개발중인데, android studio 애뮬레이터에서 expo go로 실행시켰을 때는 제대로 동작하는데 eas build를 통해 apk 파일로 만들어서 실제 기기 혹은 android studio 애뮬레이터에서 다운 받아서 실행만 하면 TypeError: Cannot read property 'bubblingEventTypes' of null 에러가 뜹니다. stack overflow나 github 커뮤니티에 있는 방법들 모두 해봤는데 소용이 없었습니다. 제발 도움주시면 감사하겠습니다. 더 필요한 정보 있으시면 제공해드리겠습니다. "dependencies": { "@gorhom/bottom-sheet": "^5.1.1", "@react-native-async-storage/async-storage": "1.23.1", "@react-navigation/bottom-tabs": "^7.2.1", "@react-navigation/native": "^7.0.15", "@react-navigation/stack": "^7.1.2", "@supabase/supabase-js": "^2.49.1", "@tanstack/react-query": "^5.40.0", "base64-arraybuffer": "^1.0.2", "buffer": "^6.0.3", "expo": "^52.0.41", "expo-auth-session": "^6.0.3", "expo-clipboard": "~7.0.1", "expo-constants": "^17.0.8", "expo-image-picker": "^16.0.6", "expo-linking": "^7.0.5", "expo-location": "^18.0.8", "expo-status-bar": "~2.0.1", "expo-updates": "~0.27.4", "npm": "^11.1.0", "react": "18.3.1", "react-hook-form": "^7.54.2", "react-native": "0.76.7", "react-native-geocoding": "^0.5.0", "react-native-gesture-handler": "^2.20.2", "react-native-get-random-values": "^1.11.0", "react-native-image-zoom-viewer": "^3.0.1", "react-native-maps": "^1.18.0", "react-native-reanimated": "^3.16.7", "react-native-url-polyfill": "^2.0.0", "zustand": "^5.0.3" }, "devDependencies": { "@babel/core": "^7.25.2", "@babel/plugin-transform-class-properties": "^7.25.9", "@babel/plugin-transform-private-methods": "^7.25.9", "@babel/plugin-transform-private-property-in-object": "^7.25.9", "@types/react": "~18.3.12", "@types/react-native-vector-icons": "^6.4.18", "metro-react-native-babel-preset": "^0.77.0", "react-native-dotenv": "^3.4.11", "typescript": "^5.3.3" }, "private": true } android studio 로그캣에서 아래와 같이 뜨고 앱이 꺼집니다. com.facebook.react.common.JavascriptException: TypeError: Cannot read property 'bubblingEventTypes' of null This error is located at: in RNSScreen in Unknown in Suspender in Suspense in Freeze in DelayedFreeze in InnerScreen in Unknown in MaybeScreen in RNSScreenContainer in ScreenContainer in MaybeScreenContainer in RCTView in Unknown in CardStack in RNCSafeAreaProvider in SafeAreaProvider in SafeAreaProviderCompat in RNGestureHandlerRootView in GestureHandlerRootView in StackView in PreventRemoveProvider in NavigationContent in Unknown in StackNavigator in AuthNavigator in ThemeProvider in EnsureSingleNavigator in BaseNavigationContainer in NavigationContainerInner in _QueryClientProvider in RNGestureHandlerRootView in GestureHandlerRootView in RCTView in Unknown in App in RCTView in Unknown in AppContainer, stack: