❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다.에러 잘라서 올리시면 안됩니다!(에러 일부만 자르거나 일부만 복사하지말아주세요)  OS는 윈도우 사용중이고 expo go 앱을 설치해서 실행하려고 보니 iOS 앱은 52버전으로 사용할 수가 없어서 프로젝트를 54로 올려서 쓰라는데, 에뮬레이터말고 실 iOS에서 사용하려면 해당 프로젝트 어떻게 업데이트 해야하는지 방법 알 수 있을까요?

❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. (에러 일부만 자르거나 일부만 복사하지말아주세요) 캘린더에서 게시글을 선택을 하면 navigation.navigate('Feed', { screen: 'FeedDetail', params: { id: postId }, initial: false, }); 이렇게 Feed 스택을 통해서 Feed 상세 스크린트로 이동하잖아요. 그래서 클릭할 때보면  캘린더 위에 Feed 목록 그 위에 Detail이 쌓이는 것을 확인하였습니다. 다만 게시글 상세에서 뒤로가기 했을 때 의도한 경로는 캘린더의 다시 그 상태로 남아아할텐데 그렇지 않고 목록으로 가서 어떻게 해야하는지 궁금합니다. 

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

윈도우+안드로이드 환경에서 KeyboardAwareScrollView가 동작하지 않아 React Native 문서를 보고 KeyboardAvoidingView component를 사용하려고 시도 했습니다.import Button from "@/components/CustomButton"; import DescriptionInput from "@/components/DescriptionInput"; import TitleInput from "@/components/TitleInput"; import { useCreatePost } from "@/hooks/queries/useCreatePost"; import useKeyboardOffset from "@/hooks/useKeyboardOffset"; import { ImageUri } from "@/types"; import { zodResolver } from "@hookform/resolvers/zod"; import { useNavigation } from "expo-router"; import { useEffect } from "react"; import { FormProvider, useForm } from "react-hook-form"; import { KeyboardAvoidingView, ScrollView, StyleSheet } from "react-native"; import z from "zod"; export default function PostWriteScreen() { // ... const { isKeyboardShown, keyboardVerticalOffsetValue } = useKeyboardOffset(); // ... useEffect(() => { navigation.setOptions({ headerRight: () => ( <Button label="Save" size="medium" variant="standard" onPress={postForm.handleSubmit(onSubmit)} /> ), }); }); // ... return ( <FormProvider {...postForm}> <KeyboardAvoidingView behavior="padding" keyboardVerticalOffset={keyboardVerticalOffsetValue} enabled={isKeyboardShown} style={{ flex: 1 }} > <ScrollView style={styles.container} contentContainerStyle={styles.contentContainer} > <TitleInput /> <DescriptionInput /> <DescriptionInput /> <DescriptionInput /> <DescriptionInput /> </ScrollView> </KeyboardAvoidingView> </FormProvider> ); } const styles = StyleSheet.create({ container: { flex: 1, }, contentContainer: { flexGrow: 1, padding: 16, gap: 16, }, }); import { useEffect, useState } from "react"; import { Keyboard } from "react-native"; import { useSafeAreaInsets } from "react-native-safe-area-context"; export default function useKeyboardOffset() { const [isKeyboardShown, setIsKeyboardShown] = useState<boolean>(false); const insets = useSafeAreaInsets(); const verticalInsets = insets.top + insets.bottom; const keyboardVerticalOffsetValue = (Keyboard.metrics()?.height || 0) + verticalInsets + 50; useEffect(() => { const showSubscription = Keyboard.addListener("keyboardDidShow", () => { setIsKeyboardShown(true); }); const hideSubscription = Keyboard.addListener("keyboardDidHide", () => { setIsKeyboardShown(false); }); return () => { showSubscription.remove(); hideSubscription.remove(); }; }, []); return { isKeyboardShown, keyboardVerticalOffsetValue }; }단순히 Keyboard 문서를 확인하니 event listener 부분이 있어 그걸 참고하여 metric().height 만큼 offset을 주고 비슷하게 동작은 하도록 작성했습니다. 추가적으로, 아랫 부분이 조금 짤려서 임의로 50을 추가했습니다.이미 비슷한 질문이 올라 왔길래 '안드로이드 KeyboardAwareScrollView 이슈 수정 & 키보드 상태 커스텀 훅 만들기' 강의 확인하고 훅으로만 분리했는데 강의 중 상세 코드는 다르기도 하고 iOS 환경에서는 테스트를 할 수가 없어서 이런 식으로 짜도 되는지, 그리고 위에서 언급한 50에 해당하는 공간이 왜 필요한지 질문 드립니다.

❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. (에러 일부만 자르거나 일부만 복사하지말아주세요) 안드로이드의 경우 앱을 열어놓고 설정화면으로 넘어간 다음으로 경로 권한을 내리고 다시 앱으로 돌아가면 앱이 재실행되어 useAppState 가 초기화되어 의도한 동작을 하지 않습니다. 1번의 경우에 앱을 다시 백그라운드에 두고 다시 앱을 켜면 의도한 동작이 실행되는데 이상하게 getCurrentPosition 의 에러 콜백이 무한으로 돕니다....

❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. (에러 일부만 자르거나 일부만 복사하지말아주세요) 작성해주신 스타일은 flex:1 만 처리해도 지도가 나오셨는데 직접 해볼 때에는 flex:1 로는 안되고 container 추가한 후에 height 100%에 MapView에 StyleSheet.absoluteFillObject 추가해야 보이네요 ㅠ! 스타일이라 뭐 크게 이슈는 없어보이긴하는데.. 앞으로 강의듣는데 지장없겠쬬? ㅎㅎ

❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. (에러 일부만 자르거나 일부만 복사하지말아주세요) [ios실행시][안드로이드 실행시]클로드에게 에러 물어보니 다시 재설치하라는 말만 나와서요 ;; 뭐가 문젠지 혹시 알수있을까요 ? node version : v24.8.0ProductName: macOS ProductVersion: 15.7 BuildVersion: 24G222Xcode 26.0 Build version 17A324

react-native에서는 arrow 함수는 지양하나요?

아직 앞강의를 보진 않았지만 즉시 함수로 처리하셨던 의도가 궁금합니다!

강의에서는 패딩으로 간격만 주셨지만 전 통일성을 주고 싶어 ios처럼 android header의 title도 중앙에 오게 하고 싶어 제가 한 방법을 공유하기 위해 글 작성합니다..!일단 android일때만 headerTitleAlign 기능을 주기 위해 constants폴더에 플랫폼에 대한 플래그 변수를 만들었습니다.// /constants/platform.ts import { Platform } from "react-native"; export const isAndroid = Platform.OS === "android"; export const isIOS = Platform.OS === "ios"; // /app/auth/_layout.ts import { colors } from "@/constants"; import { isAndroid } from "@/constants/platform"; import Foundation from "@expo/vector-icons/Foundation"; import { Link, Stack } from "expo-router"; export default function AuthLayout() { return ( <Stack screenOptions={{ headerTintColor: colors.BLACK, contentStyle: { backgroundColor: colors.WHITE, }, }} > <Stack.Screen name="index" options={{ title: "로그인", headerShown: true, headerStyle: {}, ...(isAndroid && { headerTitleAlign: "center" }), headerLeft: () => ( <Link href={"/"} replace style={{ paddingRight: 5 }}> <Foundation name="home" size={28} color={"black"} /> </Link> ), }} /> </Stack> ); } 그 다음 안드로이드일 때만 헤더 텍스트를 중아에 오도록 지정했습니다!

버전 차이 (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: MACReactNative: › 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이런 오류가 생깁니다 ㅠㅠ어떻게 해야 해결이 되는지 궁금합니다!

❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. (에러 일부만 자르거나 일부만 복사하지말아주세요) 안녕하세요. 우면 R&D 사내 입니다. figma.com 에서 접속후 .fig 파일 import 가 진행되지 않습니다. 아마도 사내에서 파일 업로드를 막은 듯 한데요. 혹시 사외에서 교육 진행이 가능한가요? 감사합니다.

import { SafeAreaView, useSafeAreaInsets, } from "react-native-safe-area-context"; // react-native-safe-area-context: 5.4.0강의 내용처럼 위 SafeAreaView를 사용할 경우 아래 이미지처럼 헤더 아래 부분이 넓어지는데요.iOSandroid <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깃이슈로도 올라와 있는데 추후 버전 업데이트 되서 해결되거나 다른 좋은 방법이 있으신 분들은 댓글로 알려주세요.

RDS 부분에서 vim .env 수정하면 된다는데, 어떻게 하라는 건지 이해가 안가요 .env 는DB_HOST 만 수정해주면 되나요?? [Nest] 28937 - 2025. 09. 07. 오후 4:15:42 ERROR [TypeOrmModule] Unable to connect to the database. Retrying에러도 발생하고 잇어요

안녕하세요 강사님 양질의 강의 재밌게 잘 수강중입니다! 푸시 알림 테스트 개발 단계까지 왔는데 IOS는 애플 개발자 멤버십에 가입을 해야해 과금이 부담되어 건너뛰었습니다.안드로이드 환경에서라도 테스트 해보고 싶어서 강의 따라가면서 빌드는 성공했습니다! 실제 안드로이드 기기는 가지고 있지 않아서 코드 에디터 상에서 npx expo start 명령어 후에 development build 모드인것도 확인하고 android 에뮬레이터에서 바로 앱이 실행이 되었습니다  이런 에러화면도 띄워지고 콘솔창에 실제 기기를 사용해 주세요 라는 에러가 잡혀서 실제 기기를 사용해야 하나 하고 깔끔히 포기하려 합니다실제 기기를 사용해야하는건지 또 다른 방법이 있는지 팁 부탁드려도 될까요? 강의에서는 에뮬레이터가 아닌 다른 걸 띄우신거 같은데 알려주시면 감사하겠습니다...!!❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다.에러 잘라서 올리시면 안됩니다!(에러 일부만 자르거나 일부만 복사하지말아주세요) 

❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다.  안녕하세요 강사님강의를 따라서 실행해보고 있는데,현재 ios는 시뮬레이터가 켜지지만, 안드로이드는 켜지지 않는 상황입니다.npx react-native doctor를 사용하여 뭐가 문제인지 확인했는데 해당 스크린샷처럼 나왔습니다환경변수도 공식문서처럼 다 했습니다.

Distribute App 버튼 클릭 시, 다음과 같은 에러가 표시됩니다 Upload Symbols FailedThe archive did not include a dSYM for the hermes.framework with the UUIDs  현재 React Native 버전으로 강의를 진행하다 보면 환경변수에서 Android 버전 관련 에러가 떠서, GitHub에서 pull 받아서 진행했는데 혹시 그게 원인일까요?

안녕하세요.게시물 업로드 요청 시 500 Internal Server Error 에러가 발생합니다.현재 코드에는 쿠키도 함께 전달되고, 네트워크 탭에서 확인해보면 formData 값도 정상적으로 전송되는 것으로 보입니다. const onSubmit: FormEventHandler = (e) => { e.preventDefault(); // formData 객체에 값 넣기 const formData = new FormData(); formData.append("content", content); preview.forEach((item) => { if (item) { formData.append("images", item.file); } }); // 전송 fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/posts`, { method: "post", credentials: "include", body: formData, }); };그런데 서버에서는 userId가 undefined로 들어가고 User 정보가 없다(?)는 오류가 발생합니다.다른 분들의 Internal server error 관련 질문을 살펴봐도, 이 문제가 프론트에서 확인할 수 있는 부분인지 잘 구분이 되지 않아 질문드립니다.제가 어디를 중점적으로 확인해보면 좋을까요?

❗질문 작성시 꼭 참고해주세요에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다.질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github을 첨부해주세요.개발중인 OS, ReactNative, Node 버전 등의 개발환경을 알려주셔야합니다.에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. (에러 일부만 자르거나 일부만 복사하지말아주세요) 안드로이드 환경에서 프로필 사진 수정 강의를 수강중에 계속 에러가 발생해서 진행하지 못했는데제가 문제원인을 추론해봤습니다. 우선 문제가 발생한 부분은 AddLocationScreen에서는 여러가지 사진을 등록해도 괜찮지만 프로필 사진은 단 한장만 등록해야하기 때문에useImagePicker 훅에 single과 multiple mode를 설정하는 과정에서 발생했습니다 .강의의 모든 코드를 따라서 적고 프로필 수정을 하기위해 actionSheet에서 [앨범에서 사진선택]을 누르면권한을 확인해 달라는 Toast오류 메시지가 발생했습니다. 하지만 AddLocation화면에서 이미 권한을 허용해 줬기 때문에 권한으로 인한 문제는 아니라 파악했고 useImagePicker 훅의 handleChangeImage 함수에서 에러 로그를 찍어본 결과 java.lang.IllegalArgumentException: Max items must be higher than 1이러한 로그를 확인 할 수 있었습니다 . 그래서 추측한 결과는강사님 코드에서 ImageCropPicker.openPicker({ mediaType: 'photo', multiple: true, includeBase64: true, maxFiles: mode === 'multiple' ? 5 : 1, })이 부분이 multiple은 true로 되어있지만, singlemode로 들어올 경우 maxFiles가 1로 설정되기 때문에 두 옵션이 충돌이 발생하는걸로 추측됩니다 . 그래서 저는 아래와 같이 일단 수정해서 문제를 해결했습니다.const handleChangeImage = () => { ImageCropPicker.openPicker({ mediaType: 'photo', multiple: mode === 'multiple', includeBase64: true, ...(mode === 'multiple' && { maxFiles: 5 }), }) .then(images => { const imageArray = Array.isArray(images) ? images : [images]; const formData = getFormDataImages('images', imageArray); uploadImages.mutate(formData, { onSuccess: data => mode === 'multiple' ? addImageUris(data) : replaceImageUri(data), onSettled: () => onSettled && onSettled(), }); }) .catch(error => { if (error.code !== 'E_PICKER_CANCELLED') { console.log('[error]', error); Toast.show({ type: 'error', text1: '권한을 허용했는지 확인해주세요.', position: 'bottom', }); } }); };multiple옵션은 mode==='multiple' 코드를 통해 mode의 값에 따라 true / false로 주어지게 하였고maxFiles 옵션또한 mode가 multiple인 경우에만 maxFiles:5라는 옵션이 주어지게 하였습니다.아마 multiple옵션이 false로 주어지면 maxFiles가 자동으로 1로 설정되어서 발생하는 충돌문제 였던 것 같습니다.강의 들으시는 분들에게 도움이 되었으면 합니다 .