❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. 에러 잘라서 올리시면 안됩니다! (에러 일부만 자르거나 일부만 복사하지말아주세요) OS는 윈도우 사용중이고 expo go 앱을 설치해서 실행하려고 보니 iOS 앱은 52버전으로 사용할 수가 없어서 프로젝트를 54로 올려서 쓰라는데, 에뮬레이터말고 실 iOS에서 사용하려면 해당 프로젝트 어떻게 업데이트 해야하는지 방법 알 수 있을까요?
SafeAreaView는 2025년 8월에 deprecated되었다고 합니다.. 그래서 다른 방법을 찾다가 해결법을 찾아서 블로그에 정리해두었습니다. 저는 iPhone 16 Pro 시뮬레이터를 돌리기 때문에 다른 곳에서도 반영이 되는지는 잘 모르겠습니다. https://velog.io/@kuck523/SafeAreaView-%EC%97%86%EC%9D%B4-useSafeAreaInsets%EC%9C%BC%EB%A1%9C-ios-%EB%85%B8%EC%B9%98-%EB%8C%80%EC%9D%91%ED%95%98%EA%B8%B0
강의 중에는 PanResponder.create에 들어가는 객체의 속성으로 onStartShouldSetPanResponder를 소개하지만, 작동이 안되서 Github 코드를 살펴보니 onMoveShouldSetPanResponder로 해야 함 const panResponderRef = useRef( PanResponder.create({ onStartShouldSetPanResponder: () => true, // Pan 작업에 반응하도록 설정 onPanResponderMove: (event, gestureState) => { ... 수정 후 const panResponderRef = useRef( PanResponder.create({ onMoveShouldSetPanResponder: () => true, // Pan 작업에 반응하도록 설정 onPanResponderMove: (event, gestureState) => { ...
버전 차이 (RN StyleSheet, Expo)의 문제거나 안드로이드의 문제인지는 모르겠지만 강의 중 코드로 작성하면 아래와 같은 문제가 나옵니다. Pressable과 Text에 backgroundColor와 color가 스타일링이 되는 방식이나 Button 요소에 opacity가 적용이 되지 않는 듯한 이슈인 것 같아서 아래와 같이 해결했습니다. return ( <Pressable style={({ pressed }) => [ styles.container, styles[size], { backgroundColor: styles[variant].backgroundColor }, pressed && styles.pressed, ]} {...props} > <Text style={[styles.text, { color: styles[variant].color }]}> {label} </Text> </Pressable> ); ... const styles = StyleSheet.create({ container: { borderRadius: 8, justifyContent: "center", alignItems: "center", }, text: { fontSize: 14, fontWeight: "bold", }, // size large: { width: "100%", height: 44, }, medium: {}, // variant filled: { backgroundColor: colors.ORANGE_600, color: colors.WHITE, }, // Pressable props pressed: { opacity: 0.8, }, }); 저는 강의 코드 대신 이렇게 해서 해결은 되었는데 혹시 이 이슈가 일어나는 이유와 앞으로 코드 복잡도가 어떻게 될 지는 모르겠지만 CustomButton이 그렇게 복잡해지진 않을 것 같은데 방법이 최선일지, 아니면 더 개선할 점이 있는지 궁금합니다.
❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. 에러 잘라서 올리시면 안됩니다! (에러 일부만 자르거나 일부만 복사하지말아주세요) OS: MAC ReactNative: › Using Expo Go › Press s │ switch to development build › Press a │ open Android › Press i │ open iOS simulator › Press w │ open web › Press j │ open debugger › Press r │ reload app › Press m │ toggle menu › shift+m │ more tools › Press o │ open project code in your editor › Press ? │ show all commands Logs for your project will appear below. Press Ctrl+C to exit. › Opening on Android... › Opening emulator Medium_Phone_API_36.0 Error: could not connect to TCP port 5554: Connection refused 이런 오류가 생깁니다 ㅠㅠ 어떻게 해야 해결이 되는지 궁금합니다!
"dependencies": { "expo": "^54.0.0", "expo-font": "~14.0.8", "expo-router": "~6.0.3", "expo-secure-store": "~15.0.7", "react": "18.3.1", "react-dom": "^18.3.1", "react-native": "^0.76.9" }, "devDependencies": { "@react-native/gradle-plugin": "^0.76.0", "@types/react": "~18.3.12", "typescript": "^5.3.3" } > Could not resolve expo.modules:expo-module-gradle-plugin:1.0.0. Required by: root project : > Could not resolve expo.modules:expo-module-gradle-plugin:1.0.0. > Could not get resource ' https://repo.expo.dev/maven/expo/modules/expo-module-gradle-plugin/1.0.0/expo-module-gradle-plugin-1.0.0.pom '. > Could not GET ' https://repo.expo.dev/maven/expo/modules/expo-module-gradle-plugin/1.0.0/expo-module-gradle-plugin-1.0.0.pom '. > The server may not support the client's requested TLS protocol versions: (TLSv1.2). You may need to configure the client to allow other protocols to be used. For more on this, please refer to https://docs.gradle.org/8.10.2/userguide/build_environment.html#sec:gradle_system_properties in the Gradle documentation. npx expo run 하면 위처럼 에러가나옵니다 찾아보니 최근데 생기는 에러들인것같은데 별로 쌓인데이터도 없고 검색햇을때 나오는것들도 없어서 많이힘드네용
질문 글을 올리려다가 방법을 찾고, 혹시 같은 상황이신 분이 있을지도 몰라서 공유합니다. 빌드 환경에 Expo Go인지 development build인지 확인이 필요하더라구요... 저는 왜 안되는지 이것저것 삽질하며 살펴보다가 현재 환경이 Expo Go 환경이 아니라는 걸 알고 너무 허무했습니다 ㅠ uri-scheme은 expo 환경만 테스트 되니까 development build 이신 경우에 s를 눌러서 Expo Go로 바꾸시면 됩니다!
<Stack> <Stack.Screen name="(tabs)" options={{ headerShown: false }} /> <Stack.Screen name="modal" options={{ presentation: "modal", headerShown: false }} /> </Stack> 위와 같이 작업하면 탭을 누를 때마가 스택이 쌓이는게 아닌가요? 그러면 물리 백버튼을 눌렀을 때 탭 이동이 될 것 같아서요. 카카오를 예시를 보면 탭은 스택을 쌓지 않고 있어서 탭 이동을 아무리 해도 뒤로 가기를 누르면 탭 이동을 하고 있지 않네요.
wipe data 이후에 npm run android 를 실행하면 아래와 같은 오류가 발생합니다. CommandError: No development build (com.devparkoon.rntutorial) for this project is installed. Install a development build on the target device and try again. 강의 영상과 다르게 npm run android 를 실행했을 때 expo 를 다시 설치하는 과정이 없는데 어떤 문제일까요? 위 이슈를 해결하기 위해 eas build 를 다시 하면 되긴 합니다 (10분 넘게 다시 소요됨)
import { SafeAreaView, useSafeAreaInsets, } from "react-native-safe-area-context"; // react-native-safe-area-context: 5.4.0 강의 내용처럼 위 SafeAreaView 를 사용할 경우 아래 이미지처럼 헤더 아래 부분이 넓어지는데요. iOS android <Stack.Screen name="[id]" options={{ headerShown: true, 색상을 넣고 원인을 찾아보니 헤더가 true 일때 헤더 크기만큼 아래 중복되서 넓어지는 것을 발견했어요. 해결방법 <SafeAreaView style={styles.container} edges={["bottom", "left", "right"]} > 이렇게 edges 부분을 추가하시면 되요. https://github.com/AppAndFlow/react-native-safe-area-context/issues/650 깃이슈로도 올라와 있는데 추후 버전 업데이트 되서 해결되거나 다른 좋은 방법이 있으신 분들은 댓글로 알려주세요.
안녕하세요 강사님 양질의 강의 재밌게 잘 수강중입니다! 푸시 알림 테스트 개발 단계까지 왔는데 IOS는 애플 개발자 멤버십에 가입을 해야해 과금이 부담되어 건너뛰었습니다. 안드로이드 환경에서라도 테스트 해보고 싶어서 강의 따라가면서 빌드는 성공했습니다! 실제 안드로이드 기기는 가지고 있지 않아서 코드 에디터 상에서 npx expo start 명령어 후에 development build 모드인것도 확인하고 android 에뮬레이터에서 바로 앱이 실행이 되었습니다 이런 에러화면도 띄워지고 콘솔창에 실제 기기를 사용해 주세요 라는 에러가 잡혀서 실제 기기를 사용해야 하나 하고 깔끔히 포기하려 합니다 실제 기기를 사용해야하는건지 또 다른 방법이 있는지 팁 부탁드려도 될까요? 강의에서는 에뮬레이터가 아닌 다른 걸 띄우신거 같은데 알려주시면 감사하겠습니다...!! ❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. 에러 잘라서 올리시면 안됩니다! (에러 일부만 자르거나 일부만 복사하지말아주세요)
