월 14,300원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결배달앱 클론코딩 [with React Native]
Complete 화면에서 bottom tab bar를 숨길 수 있을까요?
안녕하세요! 제로초님!좋은 강의 감사합니다.제로초님의 강의를 듣고 개인 프로젝트를 진행하고 있던 중 궁금한 점이 있어 질문 드립니다 현재 Complete 구조에 해당하는 화면에서 하단 탭을 안보이게 하고 싶은데, 해결을 하지 못하여 질문을 드립니다. [ 공부한 내용]공식 문서에서는 특정 스크린에서 하단 탭을 숨기고 싶다면 구조를 변경하라고 말하고 있는데, 제가 원하는 방법은 아니어서 다른 방법을 찾아보았습니다.https://reactnavigation.org/docs/hiding-tabbar-in-screens tabBarvisible을 사용하면 tab안에 있는 stack에서 하단 탭을 안보이게 할 수 있다는 블로그도 많이 확인하였지만 공식문서에서 tabBarvisible을 더이상 지원하지 않는다고 하여 사용하지 않았습니다.https://reactnavigation.org/docs/upgrading-from-5.x 아래 블로그에서 React.useLayoutEffect를 사용해 컴포넌트에 접근하였을 때 화면 이름과 navigation.setOptions를 활용하여 하단 탭을 안보이게 하는 방법이 있다고 하여 적용해 보았으나 제 프로젝트에서는 동작하지 않았습니다.https://velog.io/@yejinleee/ReactNative-%EC%8A%A4%ED%83%9D%EB%82%B4%EB%B9%84%EA%B2%8C%EC%9D%B4%EC%85%98%EC%97%90%EC%84%9C-%ED%83%AD-%EB%B0%94-%EC%88%A8%EA%B8%B0%EA%B8%B0 혹시 Complete 화면에서 하단 바를 안보이게 하는 방법이 있을까요? 항상 좋은 답변을 해주셔서 감사합니다 : )
- 해결됨배달앱 클론코딩 [with React Native]
이미지 합성방법
안녕하세요 제로초님혹시 reactnative에서 이미지 두개를 합성해서 한개의 이미지로 만드는방법이 있을까요??
- 미해결배달앱 클론코딩 [with React Native]
장소 검색 기능 구현을 하다가 난관에 봉착해, 조언을 요청드립니다.
질문 카테고리를 변경하다가 내용이 다 삭제되어 다시 질문을 올립니다ㅠㅠ우선 좋은 강의 만들어 주셔서 감사합니다!초보자임에도 불구하고 강의를 듣고 나서 앱을 만들 수 있겠다는 자신감을 얻어 앱을 만들던 중 난관에 봉착하여 질문을 드립니다. 만드려고 하는 기능은 다음과 같습니다.사용자가 장소를 검색.검색한 장소를 네이버 지도에서 마커로 표시해줌. 질문은 다음과 같습니다.장소 검색 기능을 추가하려고 합니다. 카카오 장소 검색 api를 사용하는 것이 제일 좋은 방법인지 궁금합니다.카카오 장소 검색 api는 웹뷰를 이용해야 하는 것 같은데 웹뷰 구동 방식이 제가 생각하는 방식이 맞는지 궁금합니다.reactnative에서 react 프로젝트 호출 -> react에서 카카오 장소 검색 api 호출 -> 카카오 api 응답 -> react에서 reactnative 프로젝트로 응답 전달 -> reactnative에서 응답을 받아서 사용 제가 알아본 과정은 다음과 같습니다.제로초님께서 react-native-naver-map 라이브러리는 장소 검색 기능이 없다는 것을 알게 되었습니다.장소 검색을 하기 위해서는 새로운 api를 사용해야 한 다는 것을 깨닫고, 네이버 장소 검색 api를 확인해본 결과, 네이버 장소 검색 api는 최대 5개의 결과값만 받을 수 있다는 것을 알게 되었습니다.응답을 5개만 받을 수 있다는 한계가 너무 명확하여, 대안을 찾던 도중 카카오 장소검색 api, 구글 장소 검색 api가 있는 것을 확인하였습니다.구글 장소 검색 api를 사용한 블로그 글이 꽤 있었지만 네이버 지도 + 구글 장소 검색 api 조합을 사용 할 거라면 차라리 구글 지도 + 구글 장소 검색 api 조합이 더 좋을 것 같다는 판단을 하였지만 네이버 지도를 사용하고 싶었기 때문에 최종적으로는 네이버 지도 + 카카오 api를 사용하려고 합니다.카카오 장소 검색 api를 사용하기 위해 카카오 장소 검색 안드로이드 api 공식 문서를 살펴본 결과, 내용이 자바 코드로 안내가 되어있었습니다.처음에는 자바 코드로 작성되어 있어서 어리둥절 하였지만 안드로이드는 자바 or 코틀린으로도 개발한다는 것을 알게 되었습니다. 몇몇 블로그를 살펴보니 reactnative에서 카카오 장소 검색 api를 사용할 때는 웹뷰를 사용한다는 사실을 알게 되었습니다.웹뷰를 사용한다면 리액트 프로젝트를 따로 만들고 구동해야 하는 것 같은데, 이게 최선의 방법인지 혼란스러워서 질문을 남기게 되었습니다.
- 미해결배달앱 클론코딩 [with React Native]
장소 검색 기능 구현을 하다가 난관에 봉착해, 조언을 요청드립니다.
[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.
- 미해결배달앱 클론코딩 [with React Native]
PushNotification Foregroud 상태일때 Alert 띄우기
안녕하세요Background 상태일때 푸시 잘 받아지는 것 확인했습니다앱이 Foreground 상태일때 전체 푸시를 관리자에서 보내면 사용자 화면에서 '전체 공지가 있습니다' 등의 Alert을 띄우려고 합니다.도움 부탁드립니다.고맙습니다.
- 해결됨배달앱 클론코딩 [with React Native]
`UpdatePropsManager` is not available on non-native platform. 오류입니다.
환경 운영체제 : win 10 react-native : 0.72.7node : 20.5.0안녕하세요현재 위 처럼 BottomSheetModal이 열려져 있는 상태에서 위치를 검색하세요 라는 view를 클릭할경우 아래 제출한 코드의 <Modal> 컴포넌트가 나오게 되있습니다. 하지만 아래의 오류를 현재 내고 있어 질문드리게 되었습니다.. bottom-sheet 라이브러리로 @gorhom/bottom-sheet - npm (npmjs.com) 위 링크를 사용하였습니다. 에러 로그 내용의 전체부분은 다음과 같습니다. debuggerWorker.js:69 Error: [Reanimated] UpdatePropsManager is not available on non-native platform. at Handler (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:123798:38) at BottomSheetDraggableViewComponent (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:156784:33) at RCTView at http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:59381:44 at AnimatedComponent (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:128894:38) at RCTView at http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:59381:44 at AnimatedComponent (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:128894:38) at RCTView at http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:59381:44 at BottomSheetContainerComponent (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:160869:32) at BottomSheetGestureHandlersProvider (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:160962:38) at BottomSheet (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:159277:74) at PortalHostComponent (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:162079:21) at PortalProviderComponent (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:162134:34) at BottomSheetModalProviderWrapper (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:162297:25) at RNGestureHandlerRootView at GestureHandlerRootView at Map (http://10.0.2.2:8081/src\pages\map.bundle//&platform=android&app=com.nomans…d&modulesOnly=true&dev=true&minify=false&runModule=true&shallow=true:30:42) at StaticContainer (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:170212:18) at EnsureSingleNavigator (http://localhost:8081/index.bundle//&platform=android&dev=true&minify=false&app=com.nomansland&modulesOnly=false&runModule=true:166073:25) at SceneView (익명)@debuggerWorker.js:69-TypeError: $$REQUIRE(...) is not a functionThis error is located at: in PanGestureHandler (created by BottomSheetDraggableViewComponent) in BottomSheetDraggableViewComponent (created by BottomSheet) in RCTView (created by View) in View (created by AnimatedComponent(View)) in AnimatedComponent(View) in Unknown (created by BottomSheet) in RCTView (created by View) in View (created by AnimatedComponent(View)) in AnimatedComponent(View) in Unknown (created by BottomSheet) in RCTView (created by View) in View (created by BottomSheetContainerComponent) in BottomSheetContainerComponent (created by BottomSheet) in BottomSheetGestureHandlersProvider (created by BottomSheet) in BottomSheet (created by BottomSheet) in PortalHostComponent (created by PortalProviderComponent) in PortalProviderComponent (created by BottomSheetModalProviderWrapper) in BottomSheetModalProviderWrapper (created by Map) in RNGestureHandlerRootView (created by GestureHandlerRootView) in GestureHandlerRootView (created by Map) in Map (created by SceneView) in StaticContainer in EnsureSingleNavigator (created by SceneView) in SceneView (created by BottomTabView) in RCTView (created by View) in View (created by Screen) in RCTView (created by View) in View (created by Background) in Background (created by Screen) in Screen (created by BottomTabView) in RNSScreen in Unknown (created by InnerScreen) in Suspender (created by Freeze) in Suspense (created by Freeze) in Freeze (created by DelayedFreeze) in DelayedFreeze (created by InnerScreen) in InnerScreen (created by Screen) in Screen (created by MaybeScreen) in MaybeScreen (created by BottomTabView) in RNSScreenContainer (created by ScreenContainer) in ScreenContainer (created by MaybeScreenContainer) in MaybeScreenContainer (created by BottomTabView) in RNCSafeAreaProvider (created by SafeAreaProvider) in SafeAreaProvider (created by SafeAreaInsetsContext) in SafeAreaProviderCompat (created by BottomTabView) in BottomTabView (created by BottomTabNavigator) in PreventRemoveProvider (created by NavigationContent) in NavigationContent in Unknown (created by BottomTabNavigator) in BottomTabNavigator (created by App) in EnsureSingleNavigator in BaseNavigationContainer in ThemeProvider in NavigationContainerInner (created by App) in App in RCTView (created by View) in View (created by AppContainer) in RCTView (created by View) in View (created by AppContainer) in AppContainer in NoMansLand(RootComponent)------------------------------------------------------------------------------------------------- 아래 부분은 사용하였던 코드입니다.. 긴글 읽어주셔서 감사합니다.
- 해결됨배달앱 클론코딩 [with React Native]
Flipper Plugin 'Async Storage' is not supported by the selected application
안녕하세요 환경 -운영체제 : win10 -node버전 : 16.17.0-react-native 버전 : 0.66.5-에뮬레이터 : nexus5 , x86_64 , android13-flipper 버전 : 0.239.0Flipper의 Async Storage를 다운로드 후 추가를 하려는 도중 추가할 수 없는 Unavailable plugins에 있어서 질문드립니다.Async Storage가 Unavailable plugins안에 있어서 질문드립니다마우스를 올렸을 떄 아래와 같은 메세지를 주고 있습니다. Async Storage' is not available x86_64Plugin 'Async Storage' is not supported by the selected application 추가적으로 Flipper를 실행시켰을때 왼쪽 상단에 Flipper(0.239.0)(Unsuppoerted)가 발생하고 있습니다감사합니다.
- 미해결배달앱 클론코딩 [with React Native]
encrypted stroage 질문
안녕하세요 제로초님! https://github.com/emeraldsanto/react-native-encrypted-storage encrypted stroage 깃헙을 가보니 아카이브가 되어있어서 더이상 개발할게 없어서 중지한건지 아니면 다른 라이브러리로 이전한건지 잘 모르겠네요!? 혹시 encrypted stroage를 계속 사용해도 될까요?
- 미해결배달앱 클론코딩 [with React Native]
nmap 에뮬레이터 build 관련 오류입니다..
호스트 운영체제 : windowsreact-native 버전 : 0.64강의에 나온 대로 commit부분 참조해 패키지 변경도 하였으며 강의에서 추가적으로 말씀해주신 proguard부분도 변경하였습니다.-keep class com.nomansland.gchatproject.BuildConfig{*}; 위 부분이 제 코드에는 없었으나 추가하여 넣었습니다../gradlew clean && ./gradlew.bat 을 실행한 후 react-native run-android를 실행했으나.. 아래와 같은 오류가 계속발생하는데 해결을 못해 질문드리게 되었습니다..> GChatProject@0.0.1 android> react-native run-androidinfo Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.Jetifier found 1134 file(s) to forward-jetify. Using 8 workers...info Starting JS server...info Launching emulator...error Failed to launch emulator. Reason: Emulator exited before boot..warn Please launch an emulator manually or connect a device. Otherwise app may fail to launch.info Installing the app...> Configure project :react-native-flipperWARNING:Software Components will not be created automatically for Maven publishing from Android Gradle Plugin 8.0. To opt-in to the future behavior, set the Gradle property android.disableAutomaticComponentCreation=true in the gradle.properties file or use the new publishing DSL.WARNING:The specified Android SDK Build Tools version (30.0.2) is ignored, as it is below the minimum supported version (30.0.3) for Android Gradle Plugin 7.4.2.Android SDK Build Tools 30.0.3 will be used.To suppress this warning, remove "buildToolsVersion '30.0.2'" from your build.gradle file, as each version of the Android Gradle Plugin now has a default version of the build tools.> Task :app:checkDebugAarMetadata FAILEDDeprecated Gradle features were used in this build, making it incompatible with Gradle 8.0.You can use '--warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.See https://docs.gradle.org/7.5/userguide/command_line_interface.html#sec:command_line_warnings10 actionable tasks: 2 executed, 8 up-to-dateFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:checkDebugAarMetadata'.> Could not resolve all files for configuration ':app:debugRuntimeClasspath'.> Failed to transform react-native-0.71.0-rc.0-debug.aar (com.facebook.react:react-native:0.71.0-rc.0) to match attributes {artifactType=android-aar-metadata, com.android.build.api.attributes.BuildTypeAttr=debug, org.gradle.category=library, org.gradle.dependency.bundling=external, org.gradle.libraryelements=aar, org.gradle.status=release, org.gradle.usage=java-runtime}.> Execution failed for JetifyTransform: C:\Users\asus\.gradle\caches\modules-2\files-2.1\com.facebook.react\react-native\0.71.0-rc.0\7a7f5a0af6ebd8eb94f7e5f7495e9d9684b4f543\react-native-0.71.0-rc.0-debug.aar.> Java heap space* 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 https://help.gradle.orgBUILD FAILED in 14serror Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup.Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081FAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:checkDebugAarMetadata'.> Could not resolve all files for configuration ':app:debugRuntimeClasspath'.> Failed to transform react-native-0.71.0-rc.0-debug.aar (com.facebook.react:react-native:0.71.0-rc.0) to match attributes {artifactType=android-aar-metadata, com.android.build.api.attributes.BuildTypeAttr=debug, org.gradle.category=library, org.gradle.dependency.bundling=external, org.gradle.libraryelements=aar, org.gradle.status=release, org.gradle.usage=java-runtime}.> Execution failed for JetifyTransform: C:\Users\asus\.gradle\caches\modules-2\files-2.1\com.facebook.react\react-native\0.71.0-rc.0\7a7f5a0af6ebd8eb94f7e5f7495e9d9684b4f543\react-native-0.71.0-rc.0-debug.aar.> Java heap space* 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 https://help.gradle.orgBUILD FAILED in 14sat makeError (C:\Users\asus\GChatProject\node_modules\execa\index.js:174:9)at C:\Users\asus\GChatProject\node_modules\execa\index.js:278:16at processTicksAndRejections (node:internal/process/task_queues:96:5)at async runOnAllDevices (C:\Users\asus\GChatProject\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:109:5)at async Command.handleAction (C:\Users\asus\GChatProject\node_modules\@react-native-community\cli\build\index.js:192:9)info Run CLI with --verbose flag for more details.네이버맵에서 얻은 clientId도 넣었는데.. 혹시 제가 빼먹은게 있을까요.. <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.nomansland.gchatproject"> <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.CAMERA"/> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/> <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/> <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /> <uses-permission android:name="android.permission.VIBRATE"/> <uses-permission android:name="android.permission.READ_MEDIA_IMAGES" /> <application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:allowBackup="false" android:theme="@style/AppTheme"> <meta-data android:name="com.naver.maps.map.CLIENT_ID" android:value="{발급받은 ClientID}" /> <activity android:name=".MainActivity" android:label="@string/app_name"
- 해결됨배달앱 클론코딩 [with React Native]
안녕하세요 tab-view 설계관련 질문입니다.
안녕하세요 강의 잘보고 있습니다.강의를 참고하며 View를 구성하고 있습니다 . 현재 Tab view - group chat view -> bottomSheet View ..etc- calander view- config view 현재 Tab View를 통해 group chat view, calander ,config view등으로 이동할 수 있게 하고 각 tabview에서 돌아왔을 때 이전 상태 그대로 이도록 하고싶은데..(stack 처럼..) 혹시 방법이 없을까요..? 감사합니다..
- 해결됨배달앱 클론코딩 [with React Native]
0.66 버전 메트로 서버 opensslErrorStack: 오류 관련 질문입니다.
운영체제 윈 10 현재 REACT-NATIVE프로젝트는 아래의 명령어를 통해 0.66으로 다운로드하였습니다. PS C:\Users\asus> npx react-native init GChatProject --template react-native-template-typescript@6.8.*npx react-native run-android를 하였을 때 위 명령어를 실행 한powershell에서는 아래의 로그를 뛰어주고 있습니다. -----------------------------------------PS C:\Users\asus\GChatProject> npx react-native run-androidinfo Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.Jetifier found 870 file(s) to forward-jetify. Using 8 workers...info Starting JS server...info Installing the app...> Task :app:installDebugInstalling APK 'app-debug.apk' on 'Nexus_5_API_33(AVD) - 13' for app:debugInstalled on 1 device.BUILD SUCCESSFUL in 9s31 actionable tasks: 2 executed, 29 up-to-dateinfo Connecting to the development server...info Starting the app on "emulator-5554"...Starting: Intent { cmp=com.gchatproject/.MainActivity }------------------------------------그리고 metro 서버가 뛰어지는데요 문제는 metro 서버에서 아래와 같은에러를 발생하고 있습니다 ㅠㅠ -----------------------------------To reload the app press "r"To open developer menu press "d"Failed to construct transformer: Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:68:19) at Object.createHash (node:crypto:138:10) at stableHash (C:\Users\asus\GChatProject\node_modules\metro-cache\src\stableHash.js:19:8) at Object.getCacheKey (C:\Users\asus\GChatProject\node_modules\metro-transform-worker\src\index.js:593:7) at getTransformCacheKey (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler\getTransformCacheKey.js:24:19) at new Transformer (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler\Transformer.js:48:9) at C:\Users\asus\GChatProject\node_modules\metro\src\Bundler.js:22:29 at runNextTicks (node:internal/process/task_queues:60:5) at process.processTimers (node:internal/timers:511:9) { opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ], library: 'digital envelope routines', reason: 'unsupported', code: 'ERR_OSSL_EVP_UNSUPPORTED'} BUNDLE ./index.jserror: TypeError: Cannot read properties of undefined (reading 'transformFile') at Bundler.transformFile (C:\Users\asus\GChatProject\node_modules\metro\src\Bundler.js:48:30) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async Object.transform (C:\Users\asus\GChatProject\node_modules\metro\src\lib\transformHelpers.js:101:12) at async processModule (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler\traverseDependencies.js:137:18) at async traverseDependenciesForSingleFile (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler\traverseDependencies.js:131:3) at async Promise.all (index 0) at async initialTraverseDependencies (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler\traverseDependencies.js:114:3) at async DeltaCalculator._getChangedDependencies (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler\DeltaCalculator.js:164:25) at async DeltaCalculator.getDelta (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler\DeltaCalculator.js:94:16) at async DeltaBundler.buildGraph (C:\Users\asus\GChatProject\node_modules\metro\src\DeltaBundler.js:50:5)-------------------------------------
- 미해결배달앱 클론코딩 [with React Native]
73버전 cocoapod 다운로드 질문입니다.
안녕하세요 현재 android 와 ios앱 제작을 위해 강의를 시청하고 있습니다 . 운영체제 : win10react-native버전 : 0.73# Do you want to install CocoaPods now? 뜨면 y 입력현재 프로젝트를 받을때 CocoaPods 관련 다운 내용이 안 나와서 (묻지않았음..) 수동으로 다운로드 받으려고 합니다.아래 내용은 그때 생긴 에러 입니다.-------------------------------------PS C:\Users\asus\FoodDeliveryApp1> ^CNeed to install the following packages: pod-install@0.2.0Ok to proceed? (y) yScanning for pods...CocoaPods is only supported on darwin machinesPS C:\Users\asus\FoodDeliveryApp1> react-native-cli -version--------------------------------------------------- 공심홈페이지 나 stackoverflow 에서 윈도우에선 다운받을 수 없다고 하는 것 같긴한데.. 혹시 윈도우환경에서 다운받을 수 있는데 제가 잘못하고 있는 것인지 궁금해 질문들렸습니다 ... 추가로 정 안된다면 일단 안드로이드 위주로 개발을 진행하여 완성 한 후 ios환경에서 시험하려고 하는데요 추후에 pod-install 같은 ios 관련 환경을 추가해 앱이 동작하는지 확인할 수 있나요? 아니면 현재 프로젝트를 만들때 모두 준비되어있어야 하는지.. 궁금합니다 감사합니다!
- 미해결배달앱 클론코딩 [with React Native]
jdk 11로 환경설정했는데 게속 밤새서 버전수정해도 오류나길래 17로 변경했더니 잘됩니다.
현재 셋팅가이드는 17로 설치하라고 하더군요 17로 강의를 진행해도 될까요? 11로 했더니 진짜 10시간동안 안됬는데 17로 변경하니 바로됬습니다. 17로 강의를 들어도 되는지요
- 해결됨배달앱 클론코딩 [with React Native]
네이버맵 패키지 연동후 iosSimulator로 빌드시 에러입니다.
네이버맵 패키지 연동후 iosSimulator로 빌드시 에러입니다.빌드하니 첫화면이 RCTView.로 시작하는 에러엿고 Dismiss누르고 별문제가 아닌줄 알았지만 곧바로 CH4. 네이버맵 연동하기의 17분처럼 클릭했을때 맵이 뜨길바랬는데 topClick에러가 발생했어서 더이상 진전이 안되네요ㅠㅠ{ "name": "FoodDeliveryApp", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "lint": "eslint .", "start": "react-native start", "test": "jest" }, "dependencies": { "@react-native-async-storage/async-storage": "^1.21.0", "@react-navigation/bottom-tabs": "^6.5.11", "@react-navigation/native": "^6.1.9", "@react-navigation/native-stack": "^6.9.17", "@reduxjs/toolkit": "^2.1.0", "axios": "^1.6.7", "i": "^0.3.7", "npm": "^10.4.0", "react": "18.2.0", "react-native": "0.73.2", "react-native-config": "^1.5.1", "react-native-encrypted-storage": "^4.0.3", "react-native-flipper": "^0.212.0", "react-native-keyboard-aware-scrollview": "^2.1.0", "react-native-nmap": "github:ZeroCho/react-native-naver-map", "react-native-safe-area-context": "^4.8.2", "react-native-screens": "^3.22.1", "react-redux": "^7.2.6", "redux-flipper": "^2.0.2", "rn-flipper-async-storage-advanced": "^1.0.5", "socket.io-client": "^4.7.4" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/babel-preset": "0.73.19", "@react-native/eslint-config": "0.73.2", "@react-native/metro-config": "0.73.3", "@react-native/typescript-config": "0.73.1", "@types/react": "^18.2.6", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.6.3", "eslint": "^8.19.0", "jest": "^29.6.3", "prettier": "2.8.8", "react-test-renderer": "18.2.0", "typescript": "5.0.4" }, "engines": { "node": ">=18" } } [제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.
- 미해결배달앱 클론코딩 [with React Native]
Layout 관련해서 질문드립니다.
따로 프로젝트를 진행중에 BottomTab과 SafeAreaView (react-native-safe-area-context)를 동시에 사용하는 경우 BottomTab위에 여백이 생깁니다. 찾아본 결과 edges 속성을 적용하면 없어지긴 하는데 매번 SafeAreaView를 사용할 때 마다 edges 속성을 주는건 중복이 발생하는 느낌이 들어서요! 좋은 방법이 있을까요 ?이미지와 코드는 아래와 같습니다!function App() { return ( <NavigationContainer> <Stack.Navigator initialRouteName="BottomTab"> <Stack.Screen name="BottomTab" component={BottomTabScreen} options={{ headerShown: false }} /> </Stack.Navigator> </NavigationContainer> ); }const BottomTabScreen = ({}: BottomTabScreenProps) => { return ( <Tab.Navigator initialRouteName="Todos" screenOptions={{ headerShown: false }}> <Tab.Screen name="Todos" component={TodosScreen} /> <Tab.Screen name="AddTodo" component={AddTodoScreen} /> <Tab.Screen name="Calendar" component={CalendarScreen} /> </Tab.Navigator> ); }; const TodosScreen = ({}: TodosScreenProps) => { const renderItem = useCallback(({ item }: { item: TodoType }) => <Todo item={item} />, []); return ( <SafeAreaView> <StatusBar backgroundColor="#4367FE" barStyle="light-content" /> <FlatList data={TODOS} keyExtractor={todo => todo.id} renderItem={renderItem} /> </SafeAreaView> ); };
- 미해결배달앱 클론코딩 [with React Native]
socket의 emit에 관하여 질문있습니다!
socket.emit('login', 'hello') 해당 부분에서 emit을 계속 찍어내는 문제가 발생하고 있습니다!! useEffect의 dependenciy의 의존성을 주입 안 하면 emit을 계속 안 찍는데 어떻게 하는게 맞을까요 ??// 로그인 후 emit을 계속 보낸다. useEffect(() => { const helloCallback = (data: any) => { console.log(data); }; if (socket && isLoggedIn) { socket.emit('login', 'hello'); socket.on('hello', helloCallback); } return () => { if (socket) socket.off('hello', helloCallback); }; }, [isLoggedIn, socket]); // 로그인 후 한 번만 emit을 보낸다. useEffect(() => { const helloCallback = (data: any) => { console.log(data); }; if (socket && isLoggedIn) { socket.emit('login', 'hello'); socket.on('hello', helloCallback); } return () => { if (socket) socket.off('hello', helloCallback); }; }, []); 아래는 emit을 계속 보내는 log 입니다.
- 미해결배달앱 클론코딩 [with React Native]
pod install
npm으로 라이브러리를 다운 받았을 때마다 pod install을 해주는걸로 이해했는데 맞게 이해한걸까요 ?
- 미해결배달앱 클론코딩 [with React Native]
node, react-native 버전 호환
사용중인 node 버전이 v20.10.0. 입니다.react-native 버전 0.66 실행에 문제가 있나요?
- 미해결배달앱 클론코딩 [with React Native]
node_modules 폴더의 위치
FoodDeliveryApp 폴더 안에 node_modules 폴더가 있어야 하는 걸까요? 아니면 C:\Users\이름\AppData\Roaming\npm 에 있어야 하는걸까요?
- 미해결배달앱 클론코딩 [with React Native]
ios 세팅 중 pod install 오류 질문 드립니다 (M1 Mac)
안녕하세요 제로초님 윈도우로만 작업을 하다가 ios에서 환경세팅을 하는데 에러가 나서 질문 드립니다. 강의에 있는 FoodDeliveryApp은 아니고 공식 문서 설명대로 새로운 프로젝트를 생성해서 따라하고 있었습니다. 애러는 ios 폴더에서 pod install을 했을 때 났습니다. 아래는 pod install을 한 후의 과정입니다! % pod installFramework build type is static library[Codegen] Generating ./build/generated/ios/React-Codegen.podspec.json[Codegen] generating an empty RCTThirdPartyFabricComponentsProviderAnalyzing dependenciesFetching podspec for DoubleConversion from ../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec[Codegen] Found FBReactNativeSpecFetching podspec for RCT-Folly from ../node_modules/react-native/third-party-podspecs/RCT-Folly.podspec[Codegen] Found rncoreFetching podspec for boost from ../node_modules/react-native/third-party-podspecs/boost.podspecFetching podspec for glog from ../node_modules/react-native/third-party-podspecs/glog.podspecFetching podspec for hermes-engine from ../node_modules/react-native/sdks/hermes-engine/hermes-engine.podspec[Hermes] Using release tarball from URL: https://repo1.maven.org/maven2/com/facebook/react/react-native-artifacts/0.73.1/react-native-artifacts-0.73.1-hermes-ios-debug.tar.gzDownloading dependenciesInstalling CocoaAsyncSocket (7.6.5)Installing DoubleConversion (1.1.6)Installing FBLazyVector (0.73.1)Installing FBReactNativeSpec (0.73.1)Installing Flipper (0.201.0)Installing Flipper-Boost-iOSX (1.76.0.1.11)Installing Flipper-DoubleConversion (3.2.0.1)Installing Flipper-Fmt (7.1.7)Installing Flipper-Folly (2.6.10)Installing Flipper-Glog (0.5.0.5)Installing Flipper-PeerTalk (0.0.4)Installing FlipperKit (0.201.0)Installing OpenSSL-Universal (1.1.1100)Installing RCT-Folly (2022.05.16.00)Installing RCTRequired (0.73.1)Installing RCTTypeSafety (0.73.1)Installing React (0.73.1)Installing React-Codegen (0.73.1)Installing React-Core (0.73.1)Installing React-CoreModules (0.73.1)Installing React-Fabric (0.73.1)Installing React-FabricImage (0.73.1)Installing React-ImageManager (0.73.1)Installing React-Mapbuffer (0.73.1)Installing React-NativeModulesApple (0.73.1)Installing React-RCTActionSheet (0.73.1)Installing React-RCTAnimation (0.73.1)Installing React-RCTAppDelegate (0.73.1)Installing React-RCTBlob (0.73.1)Installing React-RCTFabric (0.73.1)Installing React-RCTImage (0.73.1)Installing React-RCTLinking (0.73.1)Installing React-RCTNetwork (0.73.1)Installing React-RCTSettings (0.73.1)Installing React-RCTText (0.73.1)Installing React-RCTVibration (0.73.1)Installing React-callinvoker (0.73.1)Installing React-cxxreact (0.73.1)Installing React-debug (0.73.1)Installing React-graphics (0.73.1)Installing React-hermes (0.73.1)Installing React-jserrorhandler (0.73.1)Installing React-jsi (0.73.1)Installing React-jsiexecutor (0.73.1)Installing React-jsinspector (0.73.1)Installing React-logger (0.73.1)Installing React-nativeconfig (0.73.1)Installing React-perflogger (0.73.1)Installing React-rendererdebug (0.73.1)Installing React-rncore (0.73.1)Installing React-runtimeexecutor (0.73.1)Installing React-runtimescheduler (0.73.1)Installing React-utils (0.73.1)Installing ReactCommon (0.73.1)Installing SocketRocket (0.6.1)Installing Yoga (1.14.0)Installing boost (1.83.0)[!] Error installing boostVerification checksum was incorrect, expected 6478edfe2f3305127cffe8caf73ea0176c53769f4bf1585be237eb30798c3b8e, got 5e89103d9b70bba5c91a794126b169cb67654be2051f90cf7c22ba6893ede0ff[!] Do not use "pod install" from inside Rosetta2 (x86_64 emulation on arm64).[!] - Emulated x86_64 is slower than native arm64[!] - May result in mixed architectures in rubygems (eg: ffi_c.bundle files may be x86_64 with an arm64 interpreter)[!] Run "env /usr/bin/arch -arm64 /bin/bash --login" then try again. 이 에러가 나오고 제가 한 과정은 다음과 같습니다. 할 때마다 pod deintegrate는 해줬습니다! 터미널 로제타로 열기 해제 -> 원인이 아니었던 것 같습니다. 다시 로제타로 열기 체크 해줬습니다.https://stackoverflow.com/questions/77738691/error-installing-boost-verification-checksum-was-incorrect-expectedError installing boost 애러를 해결하기 위해서 위의 글을 따라했지만 동일한 에러가 나왔습니다.'env /usr/bin/arch -arm64 /bin/bash --login' 명령어를 입력한 후에 pod install을 실행했지만 동일했습니다.ruby 버전이 맞지 않는 것 같아서 rbenv를 설치한 후에 rbenv global 2.7.5 명령어를 실행했습니다.해당글을 보고 ffi를 설치해준 후에 arch -x86_64 pod install 명령어를 실행했습니다!공식문서에서 bundle install을 하라고 해서 설치 후에 bundle exec pod install 해줬습니다프로젝트를 몇번 지웠다가 다시 실행중인데 계속해서 오류가 동일한 오류가 뜨네요! (설치한 게 적용이 안됐나 싶어서 전원도 껐다가 켰는데 동일합니다) 혼자 힘으로 어떻게든 해결해보려고 연휴 내내 잡고 있었는데 아직 많이 부족한 것 같습니다. 이미 너무 많은 시도와 설치를 해서 어디가 잘못됐는지도 감이 안잡히는 상태라 초기화도 생각하고 있습니다. 질문 받아주셔서 감사합니다 제로초님! 새해 복 많이 받으세요