버전 호환 문제 현재 강의 흐름대로 react-native 0.79.4 버전을 깔고 이 강의에서 npm install @react-navigation/native 과 npm install react-native-screens react-native-safe-area-context 를 그대로 실행해서 설치하면 npx pod-install ios Need to install the following packages: pod-install@1.0.9 Ok to proceed? (y) y 🔍️ Scanning for pods... 1.16.2 > pod install Found 2 modules for target mapzip2 link_native_modules! {:ios_packages=>[{:configurations=>[], :name=>"react-native-safe-area-context", :root=>"/Users/kwakori/projects/react-native/learning/mapzip2/node_modules/react-native-safe-area-context", :path=>"../node_modules/react-native-safe-area-context", :podspec_path=>"/Users/kwakori/projects/react-native/learning/mapzip2/node_modules/react-native-safe-area-context/react-native-safe-area-context.podspec", :script_phases=>[]}, {:configurations=>[], :name=>"react-native-screens", :root=>"/Users/kwakori/projects/react-native/learning/mapzip2/node_modules/react-native-screens", :path=>"../node_modules/react-native-screens", :podspec_path=>"/Users/kwakori/projects/react-native/learning/mapzip2/node_modules/react-native-screens/RNScreens.podspec", :script_phases=>[]}], :ios_project_root_path=>"/Users/kwakori/projects/react-native/learning/mapzip2/ios", :react_native_path=>"../node_modules/react-native"} Auto-linking React Native modules for target mapzip2: RNScreens and react-native-safe-area-context Framework build type is static library Configuring the target with the New Architecture [!] Invalid Podfile file: [!] /opt/homebrew/bin/node ./../node_modules/react-native/scripts/generate-codegen-artifacts.js -p /Users/kwakori/projects/react-native/learning/mapzip2/ios/.. -o /Users/kwakori/projects/react-native/learning/mapzip2/ios -t ios [Codegen] Analyzing /Users/kwakori/projects/react-native/learning/mapzip2/package.json [Codegen] Searching for codegen-enabled libraries in the app. [Codegen] The "codegenConfig" field is not defined in package.json. Assuming there is nothing to generate at the app level. [Codegen] Searching for codegen-enabled libraries in the project dependencies. [Codegen] Found react-native [Codegen] Found react-native-safe-area-context [Codegen] Found react-native-screens [Codegen] Searching for codegen-enabled libraries in react-native.config.js [Codegen] Processing FBReactNativeSpec [Codegen] Searching for podspec in the project dependencies. [Codegen] Processing rncore [Codegen] Searching for podspec in the project dependencies. [Codegen] Processing safeareacontext [Codegen] Searching for podspec in the project dependencies. [Codegen] Supported Apple platforms: ios, macos, tvos, visionos for safeareacontext [Codegen] Processing rnscreens [Codegen] Searching for podspec in the project dependencies. [Codegen] Supported Apple platforms: ios, tvos, visionos for rnscreens [Codegen] Error: Unknown prop type for "environment": "undefined" [Codegen] Done. . # from /Users/kwakori/projects/react-native/learning/mapzip2/ios/Podfile:20 # ------------------------------------------- # > use_react_native!( # :path => config[:reactNativePath], # ------------------------------------------- Couldn't install Pods. Updating the Pods project and trying again... 와 같은 에러가 발생합니다. 아무래도 버전 호환성 문제인 것 같습니다. https://github.com/software-mansion/react-native-screens/blob/main/README.md#support-for-fabric 위 문서를 참고하면 react-native-screens의 최신 버전인 4.19.0+ 는 react-native 0.81.0+ 에서만 호환된다고 하는 것 같습니다. 강의 들으시는 분들은 참고해주세요. 버전을 낮춰서 설치하시거나 하시면 정상적으로 설치되더라구요 // 아니면 혹시 그냥 react-native를 0.81.0＋ 로 설치해서 강의를 들어도 문제없으려나요?
피그마 디자인에서는 < 를 사용했는데 강의에서는 Foundation "home"을 사용했어요! 의도하신걸까요? 디자인이 최종 시안이라던가.. 그게 아니라면 강의는 동영상이니 바꾸는데 공수가 많이 들어가니 피그마에서 아이콘 바꿔주셔도 좋을것같습니다! 잡담으로 저는 자바스프링 백엔드로 시작해서 jQuery/Angular/Vue/React/Next를 풀스택으로 쓰는 회사들로 이직하면서 최종적으로 코틀린스프링을 메인스택으로 하고 있는데요. 취미/공부/사이드 프로젝트로 Next.js랑 Flutter 배우고 이번에 RN배우는데 강사님의 코드퀄리티나 강의력이 깔끔한것 같아서 잘 보고 있습니다ㅎㅎ 25년 초에 릴리즈한 강의인데 26년에도 미션이나 질문에도 답 잘 달아주셔서 감사합니다.
❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. 에러 잘라서 올리시면 안됩니다! (에러 일부만 자르거나 일부만 복사하지말아주세요) 지금은 잘 되는 것 같은데(제가 아직 안드로이드 애뮬레이터로만 테스트 한 상태이긴 하지만) 혹시 지금도 안되는지 궁금합니다!
서랍 네비게이션을 열 때마다 뒤에 MapView가 마운트 언마운트 되는 문제 아래 링크 영상처럼 서랍 네비게이션을 열 때마다 뒤에 MapView가 언마운트 마운트가 되면서 성능 관련 문제가 생기는 것 같습니다. 이게 애뮬레이터 문제인지 제 컴퓨터 문제인지, 강의에서는 이런 문제가 안보이는데.. 해당 문제 해결할 방법이 혹시 있을까요? 네비게이션을 열 때마다 렉이 걸려서 자꾸 애플리케이션이 다운됩니다 ㅠㅠ 방법을 찾아보고 메모이제이션도 해보고, Drawer 옵션도 사용해봤는데 무용지물이네요 ㅠ https://drive.google.com/file/d/1tM8iR9QgukKVd_I5zfk6GhbKneLE1DkZ/view?usp=drive_link
해당 강의대로 진행하면 잘 안됩니다ㅠㅠ 일단 Aurora and RDS로 진행했습니다. 지금 날짜로 AWS에 Amazon RDS가 없더라구요 그래서 문제가 있는지는 잘모르겠습니다. 1. 현재 package.json 명령어에서 dist/main이 아닌 dist/main.js로 해야 합니다. 이거 왜그런지 모르겠네요 보안 그룹을 설정해줘야 합니다. 사용자 지정 TCP 포트 3000 으로 열어줘야 합니다. 3. RDS 보안그룹 문제 어떤 분이 사용자 지정 TCP 해서 포트 3030을 추가해서 해결했다고 하는데 저는 잘모르겠습니다. 아래 에러가 나타나는 경우 1|main | [Nest] 6957 - 12/18/2025, 2:25:35 PM ERROR [TypeOrmModule] Unable to connect to the database. Retrying (7)... 1|main | error: no pg_hba.conf entry for host "172.31.32.15", user "mymap", database "mymap", no encryption app.module.ts에 아래 코드 추가 TypeOrmModule.forRoot({ type:'postgres', host: process.env.DB_HOST, port:5432, username: process.env.DB_USER, password: process.env.DB_PASSWORD, database: process.env.DB_NAME, ssl: { rejectUnauthorized:false, }, // 추가 }) 왜 추가해야하는지는 아직 자세히 모릅니다. 그러면 아래 에러가 뜹니다. error: database "mymap" does not exist 그럼 아래 과정 수행해야 합니다. 6. 이렇게 하면 아마도 잘 될 겁니다..ㅠ 만약에 pgAdmin에 연결해서 보고 싶으면 구글링해서 하시면 되는데 중요한 건 보안 그룹에서 인바운드 규칙 추가하는 것(PostgreSQL/TCP/5432/0.0.0.0/0)과 RDS 퍼블릭 엑세스가 "예"로 되어있어야 하는 것만 알아주시면 됩니다. 사실 여쭤보고 싶은 것 없지만 혹시나 보신다면 위 과정에서 문제될 건 없는지 알려주시면 감사하겠습니다!
npm ls react 19.1.0 npm ls react-native 0.81.5 npm ls expo 54.0.27 버전을 알려주시면 질문자분과 동일한 환경에서 답변 드릴 수 있습니다. 에뮬레이터에 location도 설정했는데 왜 마크표시를 누르면 아래 에러가 발생하는걸까요.. 빌드 지우고 다시 설치하고도 해봤습니다. LOG getMyLocation granted ERROR [Error: Uncaught (in promise, id: 1) Error: Current location is unavailable. Make sure that location services are enabled] Code: construct.js 2 | var setPrototypeOf = require("./setPrototypeOf.js"); 3 | function _construct(t, e, r) { > 4 | if (isNativeReflectConstruct()) return Reflect.construct.apply(null, arguments); | ^ 5 | var o = [null]; 6 | o.push.apply(o, e); 7 | var p = new (t.bind.apply(t, o))(); Call Stack construct (<native>) apply (<native>) _construct (node_modules/@babel/runtime/helpers/construct.js:4:65) Wrapper (node_modules/@babel/runtime/helpers/wrapNativeSuper.js:15:23) construct (<native>) _callSuper (node_modules/@babel/runtime/helpers/callSuper.js:5:108) constructor (node_modules/expo-modules-core/src/errors/CodedError.ts:11:5)
❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. (에러 일부만 자르거나 일부만 복사하지말아주세요 ) 8-8 듣고 있는데 다크모드에서 전체적으로 코드 변경을 하길래 참고하려고 깃에서 lecture8-8을 열었는데 약간 코드 구성이 다른거 같아요.
그랩님, 강의 잘 듣고 있습니다. 102강 강의를 듣고 있는데요, react-native-reanimated-carousel 설치를 위해 노션에 링크대로 npm install react-native-reanimated-carousel@3.3.0 명령어로 vs code 터미널에서 설치하고 그 이후 한번 더 expo install --npm react-native-reanimated react-native-gesture-handler 를 입력하여 vs code 터미널에서 성공적으로 설치를 완료 하였습니다. 질문 1. 그 이후 babel.config.js 파일 에 가서 plugins: ["react-native-reanimated/plugin"], 추가 해주려고 하는데요, 문제 는 babel.config.js 파일 이 어디에도 존재하지 않아 서 어디에서 플러그인 문구를 입력해 주어야 하는지 모르겠습니다. 아래는 첨부 사진입니다. 어떻게 해야 위 플러그인 문구를 입력 가능 할까요? 참고로 grab-market-mobile의 package.json에 디펜던시를 보면 아래와 같이 확인 할 수 있습니다. "react": "19.1.0", "react-native": "0.81.5", "react-native-reanimated-carousel": "^3.3.0", "react-native-reanimated": "~4.1.1", "react-native-gesture-handler": "~2.28.0" 질문 2. Babel 설정을 위해 Cache 초기화 하는 부분도 위에 질문1이 순서대로 정상적으로 진행이 되지 않아 스킵 하고 강의를 이어갔는데요, babel.config.js에 플러그인 문구부터 저장한 뒤 바벨 설정 캐시 초기화 하는 것이 옳은 건가요? 즉 순서대로 해야 하는지도 궁금합니다. 질문 3. 102강 시작부터 ~ 18분 56초 까지 타이핑 한 grab-market-mobile의 App.js react-native-reanimated-carousel 소스 내용 이 아래와 같은데요, 이것을 실행 하면 첨부한 사진과 같이 안드로이드 스튜디오(runtime not ready) 에서 에러 가 납니다. 참고 로 아래 App.js 소스는 강의 전체 완성본 소스 가 아니라 에러가 난 시점까지의 소스 입니다. 질문3-1. -->그리고 여기에서 Carousel 부분 살펴보면요, 아래 App.js 소스 에서 아래와 같이 작성하는 것 맞나요 ? 만약 아래 작성 소스 가 다르다면 , 어떻게 작성 해야하는지 답변 댓글에 소스를 적어주시면 감사하겠습니다 . < Carousel data = {banners} width = {Dimensions.get( " window ") .width } height = {200} autoPlay = {true} renderItem = {(obj) =>{ return( < TouchableOpacity > < Image source = {{uri :obj.item.imageUrl }} /> </ TouchableOpacity > ) }} /> import { StatusBar } from "expo-status-bar"; import React from "react"; import { StyleSheet, Text, View, Image, ScrollView, Dimensions, TouchableOpacity } from "react-native"; import BasketballImage from "./assets/products/basketball1.jpeg"; import Avatar from "./assets/icons/avatar.png"; import {API_URL} from "./config/constants"; import axios from "axios"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; import "dayjs/locale/ko"; import Carousel from "react-native-reanimated-carousel"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function App() { const [products, setProducts] = React.useState([]); const [banners, setBanners] = React.useState([]); React.useEffect(()=>{ axios.get(`${API_URL}/products`).then((result)=>{ setProducts(result.data.products); }).catch((error)=>{ console.error(error); }) axios.get(`${API_URL}/banners`).then((result)=>{ setBanners(result.data.banners); }).catch((error)=>{ console.error(error); }) },[]) return ( <View style={styles.container}> <ScrollView> <Carousel data={banners} width={Dimensions.get("window").width} height={200} autoPlay={true} renderItem={(obj)=>{ return( <TouchableOpacity> <Image source={{uri : obj.item.imageUrl}} /> </TouchableOpacity> ) }} /> <Text style={styles.headline}>판매되는 상품들</Text> <View style={styles.productList}> { products.map((product, index)=>{ return (<View style={styles.productCard} key={product.id}> {product.soldout === 1 && <View style={styles.productBlur}/>} <View> <Image style={styles.ProductImage} source={{uri: `${API_URL}/${product.imageUrl}`,}} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price}원</Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={Avatar} /> <Text style={styles.productSellerName} >{product.seller}</Text> </View> <Text style={styles.productDate}>{dayjs(product.createdAt).fromNow()}</Text> </View> </View> </View>); }) } </View> </ScrollView> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', paddingTop: 32, }, productCard: { width: 320, borderColor: 'rgb(230,230,230)', borderWidth:1, borderRadius: 16, backgroundColor: "white", marginBottom: 8, }, ProductImage :{ width: '100%', height: 210 }, productContents : { padding: 8 }, productSeller : { flexDirection: 'row', alignItems: 'center' }, productAvatar: { width:24, height:24, }, productFooter: { flexDirection: 'row', justifyContent:'space-between', alignItems: 'center', marginTop: 12, }, productName : { fontSize: 16 }, productPrice: { fontSize: 18, fontWeight: '600', marginTop: 8 }, productSellerName: { fontSize: 16, }, productDate: { fontSize: 16, }, productList: { alignItems:"center", }, headline : { fontSize: 24, fontWeight: "800", marginBottom:24 }, productBlur : { position: 'absolute', top: 0, bottom: 0, right: 0, left: 0, backgroundColor: "#ffffffaa", zIndex: 999, }, }); 그랩님 께서 진행하시는 강의 처럼 에러가 뜨지 않고 제대로 결과값이 나와야 하는데, 아무리 해도 어떻게 에러를 해결해야 하는지 차근차근 알려주셨으면 좋겠습니다. 아직 그랩님의 강의 102강 처음부터 ~ 19분 안되는 정도까지 진행하다 위 에러를 만나게 되어 해결이 안되고 있어서 더 진행을 하지 못하고 있어서 질문을 남깁니다. 질문 4. 아래 AI 인턴 답변을 보고 vs code의 grab-market-mobile에서 babel.config.js 을 프로젝트 루트에 파일 을 직접 생성 하고 module.exports = { presets: ['babel-preset-expo'], plugins: ['react-native-reanimated/plugin'], }; 위 소스입력 후 저장을 완료 한 뒤 캐시 초기화 를 위해 vs code grab-market-mobile의 터미널에서 expo start -c 까지 차례대로 수행 한 후 ngrok과 grab-market-server와 안드로이드 스튜디오 에뮬레이터 실행 후 마지막으로 grab-market-mobile로 연동 실행 후 결과 가 위 버전 에러와 다르게 또 새로운 에러가 발생 하게 되었습니다. 아래 사진 첨부합니다. 이 점은 어떻게 해결 해야 하는지요? 질문 5. 그리고 Vs code에서 아래 인턴님이 답변 준대로 질문 2까지 수행 하니 아래와 같은 에러가 발생 하여 사진을 첨부합니다. 이 에러 는 어떤 것을 의미 하며 해결하는 방법 은 무엇인가요? 질문 6. AI 인턴님이 남겨주신 <질문 3 및 질문 3-1>에서는 " package.json 에서 관련 패키지 를 제거 하세요"라고 써있는데요, 이것은 구체적으로 무엇을 어떻게 수행하는 건가요? 예를들면 어떤 명령어를 입력해야 합니다와 같이 알려주시면 좋겠습니다. 질문 7. ( 확인 차원 에서 재 질문 합니다.) Carousel 소스 가 궁금 한데요, 그랩님께서 강의에서 찍었을 당시 오픈소스인데 오래된 것 이라 다른 것으로 변경하여 재 촬영 해주셨다고해서 조금 햇갈린데요 , Carousel 부분 살펴보면요, 아래 App.js 소스 에서 아래와 같이 작성하는 것 맞나요 ? 만약 아래 작성 소스 가 다르다면 , 어떻게 작성 해야하는지 답변 댓글에 소스를 적어주시면 감사하겠습니다 . < Carousel data = {banners} width = {Dimensions.get( " window ") .width } height = {200} autoPlay = {true} renderItem = {(obj) =>{ return( < TouchableOpacity > < Image source = {{uri :obj.item.imageUrl }} /> </ TouchableOpacity > ) }} /> 질문 8. AI 인턴님이 남겨주신 답변에 관한 질문 3 및 3-1은 하라는대로 실행해보면 에러가 더 많이 발생할까봐아직 수행을 안했는데요 , 아래 답변대로 명령어 3개를 입력해 줘도 괜찮은건가요 ? 여쭈어보고 하는게 나을 것 같아서 다시한번 작성해 보았습니다. 명령어 1: npm uninstall react-native-reanimated-carousel react-native-reanimated 명령어 2: npm install react-native-reanimated-carousel@3.3.0 react-native-reanimated@^2.0.0 명령어 3: expo install react-native-gesture-handler 확인하시면, 그랩님께서 꼭 답변 부탁 드립니다.
그랩님, 강의 잘 듣고 있습니다. 다름이 아니라 궁금한 사항( =에러 해결방법 ) 이 필요해서 글을 남기게 되었습니다. 101강 을 듣고 있는데요 Axios 에러(400) 가 안드로이드 스튜디오 에뮬레이터에서 발생 하고 있습니다. 일단 101강 처음부터 ~ 4분 52초까지 그랩님께서 작성하신 소스코드를 똑같이 작성 후 결과 를 보려하는데, 농구공 그림 (세부사항:판매자:그랩,가격,상품명등등) 이 나오지 않아 서 이것을 어떻게 하면 그랩님과 같은 결과를 볼 수 있을지에 대해 여쭈어봅니다. 사진 1 첨부 : 판매되는 상품들 밑에 100강만 들었을 시에 농구공 화면이 잘 나왔으나 101강 4분 52초까지 의 내용의 소스코드를 입력 후 결과값 보면 400 에러도 발생하고 농구공도 안나오게 됩니다. 어떻게 해야 하나요? 사진 2 첨부 : 구체적인 에러 내용 [사진3] 스크롤은 적용이 안 된 것 같은데요, 상품이 2개 뿐이라 스크롤이 없는 건가요? [사진4] 사진 3 에 대한 구체적인 에러 ----> 어떻게 에러를 해결 할 수 있을까요 ? 안드로이드 스튜디오에서 상품 정보를 불러오지 못하는 것에 대해 서 어떻게 해결해야 할 지 차근 차근 잘 알려주셨으면 좋겠습니다 . 그리고 마지막 질문은 안드로이드 애물레이터가 잘 되는지 확인 하려면 grab-market-server에서 npm start를 해준 뒤 확인하면 되는건가요? 아니면 grab-market-mobile에서 npm start를 해준 뒤 a(=Open Android)를 누르면 되는 건가요? 아니면 둘다 동시에 npm start를 해주는 건가요? 그리고 아래에는 grab-market-mobile 폴더의 App.js 제 소스 코드를 아래에 첨부하겠습니다. import { StatusBar } from "expo-status-bar"; import React from "react"; import { StyleSheet, Text, View, Image, ScrollView } from "react-native"; import BasketballImage from "./assets/products/basketball1.jpeg"; import Avatar from "./assets/icons/avatar.png"; import {API_URL} from "./config/constants"; import axios from "axios"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; import "dayjs/locale/ko"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function App() { const [products, setProducts] = React.useState([]) React.useEffect(()=>{ axios.get(`${API_URL}/products`).then((result)=>{ setProducts(result.data.products); }).catch((error)=>{ console.error(error); }) },[]) return ( <View style={styles.container}> <ScrollView> <Text style={styles.headline}>판매되는 상품들</Text> <View style={styles.productList}> { products.map((product, index)=>{ return (<View style={styles.productCard}> <View> <Image style={styles.ProductImage} source={{uri: `${API_URL}/${product.imageUrl}`,}} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price}원</Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={Avatar} /> <Text style={styles.productSellerName} >{product.seller}</Text> </View> <Text style={styles.productDate}>{dayjs(product.createdAt).fromNow()}</Text> </View> </View> </View>); }) } </View> </ScrollView> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', paddingTop: 32, }, productCard: { width: 320, borderColor: 'rgb(230,230,230)', borderWidth:1, borderRadius: 16, backgroundColor: "white", marginBottom: 8, }, ProductImage :{ width: '100%', height: 210 }, productContents : { padding: 8 }, productSeller : { flexDirection: 'row', alignItems: 'center' }, productAvatar: { width:24, height:24, }, productFooter: { flexDirection: 'row', justifyContent:'space-between', alignItems: 'center', marginTop: 12, }, productName : { fontSize: 16 }, productPrice: { fontSize: 18, fontWeight: '600', marginTop: 8 }, productSellerName: { fontSize: 16, }, productDate: { fontSize: 16, }, productList: { alignItems:"center", }, headline : { fontSize: 24, fontWeight: "800", marginBottom:24 } }); 그랩님의 답변을 기다립니다.
하이브리드앱 과제 진행 중입니다 과제01에 " project/mobile 경로에 app 폴더를 생성하고, project/mobile/app 경로에 숙제가이드에 포함된 _layout.tsx, index.tsx 파일을 복사해 주세요." 라고 되어 있는데 숙제가이드가 안 보여서 문의드립니다. 노션에서는 "레퍼런스 코드는 모든 과정이 업데이트 후 최종 공개됩니다" 라고 되어있는데 그럼 아직 업데이트가 안 돼서 _layout.tsx, index.tsx 파일을 못 보는 건가요? 아니면 강의에서 진행했던 것처럼 _layout.tsx, index.tsx 두 파일을 수정하면 되나요?
저는 강의 수강 후 개인 앱을 만들고 있습니다. EAS preview 빌드 후 해당 빌드 내용을 Orbit을 통해 에뮬레이터에서는 로그인 부라우저가 뜨고 다음 화면까지 이동하는 프로세스가 잘 동작하는 것 까지 확인했습니다. 그런데 제 실제 디바이스에서 구동해보면 카카오 로그인 버튼을 누르면 설정해놓은 Loading spining만 뜨다가 화면이 넘어가지질 않습니다. 로그도 못보고 있어서 해결을 못하고 있는데 혹시 이런 경우 관련 해결팁이 있을까요 ? 저는 이 화면으로 넘어가고 싶은데 안되네요 ㅠㅠ..
현재 Windows환경에서 강의를 수강했습니다. 그래서 android 만 테스트할 수 있었고, 중간에 IOS를 위한 환경 세팅은 Window환경에서 할 수 있는 범위만을 수행했습니다. 그래서 궁금한 것은 추후에 맥 환경에서 개발을 할 수 있게 되었다 했을 때 강의에서 나오는 IOS 환경 설정은 모두 마쳤다면(Xcode에서 수행해야하던 세팅 모두) npm pod-install 위 명령어만 쳤을 때 바로 IOS도 사용가능할까요? 아니면 IOS 세팅이나 설치 모두 강의처럼 순서대로 진행해야할까요?
제로초님 안녕하세요 expo 프로젝트의 폴더 구조에 대해서 고민이 있습니다.!! 현재 src/app 폴더에서 페이지들을 관리하고 있고 각 페이지 내부에서만 사용하는 하위 컴포넌트들은 src/app/settings/_components/AccountSettingsSection.tsx 와 같이 _components 폴더 하위에 배치하고, named export를 통해 라우트로 잡히지 않게 하고 있습니다. 문제는 없지만 프로젝트를 실행시키면 WARN Route "./settings/_components/AccountSettingsSection/AccountSettingsSection.tsx" is missing the required default export. Ensure a React component is exported as default. 라는 경고 메시지가 app/ 내부에서 named export 한 모든 하위 컴포넌트를 대상으로 출력됩니다. Next.js처럼 _components 내부의 하위 컴포넌트들은 완전히 무시하도록 하고 싶은데 아무리 찾아봐도 무시할 방법이 없는 거 같습니다 ㅠ 제로초님께서는 어떤 방법으로 페이지 내부 하위 컴포넌트들을 배치하시는지 궁금합니다..!! 관리하기 용이한 폴더 구조가 있다면 추천해주실 수 있으신가요??
일단 위 화면까지는 PC에서 나오는데, Development servers에 링크를 클릭하면 아무 반응이 없는데, 어떻게 해야하는지 문의드립니다. 그리고, 실제 안드로이드 폰에서 테스트시에도, 아래와 같이 홈화면에 아무것도 나오지 않고, 하단 메뉴만 노출되고, 내 프로필을 클릭하면 하단 이미지 두번째처럼 오류가 나고 있습니다. 어떻게 해결해야하는지 문의드립니다.
