안녕하세요, 강의를 듣다 궁금한 점이 생겨 질문드립니다. foreground 상태 인 경우에도 Push Alert가 위에서 발생하는 앱들이 있는데 이 같은 경우는 따로, 해당 데이터가 왔을 떄 뭔가 Alert창이나, 위에서 아래로 알림창 같은게 내려오는 컴포넌트같은 것을 따로 구현하여 보여주는 것인가요??Toast와 같은 컴포넌트를 만들어서 보여주는 것인지, React-native-push-notification에서 따로 할 수 있는 방법이 있는지 궁금합니다!그리고 Channel 같은 경우는 프론트에서 먼저 구성한 후, 백엔드와 맞추어야 하는건지 궁금합니다!!!

구글링해서 찾은 방법과 GPT에서 찾은 방법으로는 해결이 안되고 있어요.brew update를 해도 안되고 watchman으로 하는 해결방법도 안됩니다. Gpt는 파일이 많아서 제한 수를 늘리는 해결방안을 주는데 그것도 안되고 있습니다!어떻게 해야할까요? 참고로 처음에 강사님이 말씀하신 버전대로 깔아서 셋팅했을 때 저 오류가 계속 떠서이번에는 다 최신 버전으로 바꿔서 해보았는데도 똑같은 오류가 발생합니다.

강의내용이 24년 현재 9월 듣고 있는데 강의 내용과 내려받는 리엑트 네이티브 파일구조가 달라서 너무 어렵습니다. 현재 강의 맞는 구버전으로 하면 expo app 버전이 구버전과 맞지 않는다고 하거나 강의 보면서 하기도 벅찬데 각종 버전에 따른 오류가 너무 많이 나오니 해결하면서 강의 듣기에 너무 힘듭니다. 뭔가 방법이 없을까요? 제가 너무 배우고 싶었던 리엑트 네이티브 강의인데 초반에 오류 수정하다 끝나고 이러니 의지가 꺽여버립니다.

학습에 관련된 질문만 해주세요.질문은 상세하게 무엇이 궁금한지 작성해주세요.질문은 '마크다운'을 사용하여 할 수 있습니다.유사한 질문이 있었는지 살펴보고 질문 해주세요. 부담갖지 말고 강의에서 궁금하신 점 전부 질문해주세요 :)

선생님 코드의 로직이 어렵게 느껴져 따라가는데 어려움을 겪고 있습니다. chatgpt를 활용해보니, 함수형 프로그래밍을 공부하면 된다고 하는데요. 혹시 먼저 함수형을 공부하고 다시 선생님 강의에 도전을 하는게 맞는 순서일까요?

안녕하세요.현업자로서 RN expo에 대한 강사님의 생각이 궁금합니다. RN 공식 페이지에서 expo 와 같은 프레임 워크 사용을 권장하는 뉘앙스로 설명을 시작하는데 ,(You can also use React Native without a Framework, however we’ve found that most developers benefit from using a React Native Framework like Expo.)  만약 강사님이 완전 새로운 앱 개발에 착수하신다면, expo 를 사용하실것 같으신가요? 아니면 native cli 로 시작하실것 같으신가요?  

npx react-native init test --version 0.72.6 Expo 아니라면 이렇게 생성해야 하는 거 아닌지요?

  import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; import { createNativeStackNavigator } from '@react-navigation/native-stack'; import React from 'react'; import Home from './src/screens/Home'; import Profile from './src/screens/Profile'; import FriendProfile from './src/screens/FriendProfile'; import EditProfile from './src/screens/EditProfile'; import Search from './src/screens/Search'; import Activity from './src/screens/Activity'; import { NavigationContainer } from '@react-navigation/native'; import Status from './src/screens/Status'; import Ionic from 'react-native-vector-icons/Ionicons'; const Stack = createNativeStackNavigator(); const Tab = createBottomTabNavigator(); const getTabBarIcon = (route, focused, size, color) => { let iconName; color = 'black'; if (route.name === 'Home') { iconName = focused ? 'home-sharp' : 'home-outline'; size = focused ? size + 8 : size + 2; } else if (route.name === 'Search') { iconName = focused ? 'search' : 'search-outline'; } else if (route.name === 'Activity') { iconName = focused ? 'heart' : 'heart-outline'; } else if (route.name === 'Profile') { iconName = focused ? 'person' : 'person-outline'; } return <Ionic name={iconName} size={size} color={color} />; }; const BottomTabScreen = () => { return ( <Tab.Navigator screenOptions={({ route }) => ({ tabBarHideOnKeyboard: true, tabBarShowLabel: false, headerShown: false, tabBarStyle: { height: 70, }, tabBarIcon: ({ focused, size, color }) => getTabBarIcon(route, focused, size, color), })} > <Tab.Screen name="Home" component={Home} /> <Tab.Screen name="Search" component={Search} /> <Tab.Screen name="Activity" component={Activity} /> <Tab.Screen name="Profile" component={Profile} /> </Tab.Navigator> ); }; const App = () => { return ( <NavigationContainer> <Stack.Navigator screenOptions={{ headerShown: false }}> <Stack.Screen name="Bottom" component={BottomTabScreen} /> <Stack.Screen name="Status" component={Status} /> <Stack.Screen name="FriendProfile" component={FriendProfile} /> <Stack.Screen name="EditProfile" component={EditProfile} /> </Stack.Navigator> </NavigationContainer> ); }; export default App;     { "name": "ReactNativeInsta", "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-navigation/bottom-tabs": "^6.6.1", "@react-navigation/material-top-tabs": "^6.6.14", "@react-navigation/native": "^6.1.18", "@react-navigation/native-stack": "^6.11.0", "react": "18.3.1", "react-native": "0.75.2", "react-native-safe-area-context": "^4.10.9", "react-native-screens": "^3.34.0", "react-native-vector-icons": "^10.1.0" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/babel-preset": "0.75.2", "@react-native/eslint-config": "0.75.2", "@react-native/metro-config": "0.75.2", "@react-native/typescript-config": "0.75.2", "@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.3.1", "typescript": "5.0.4" }, "engines": { "node": ">=18" } }  

npx create-react-native-app@latest 요거 터미널에 입력하니까, ⚠ This tool does not initialize new React Native projects. 뜨는데, 어떻게 해결하면 좋을까요?

윈도우 안드로이드 보고있는데잘 되다가 stack Navigation 공식문서보고 인스톨하고 코드추가 한 후에yarn start 하고 a 하면[CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders.[CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders.FAILURE: Build failed with an exception. * What went wrong: A problem occurred configuring project ':react-native-screens'. > [CXX1416] Could not find Ninja on PATH or in SDK CMake bin folders. * 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.org 라고 나옵니다

npx create-expo-app@latest 이렇게 설치했는데 강의랑 설치하는게 다르고 폴더구성도 다르더라구요

안녕하세요 강사님, 좋은 강의 감사합니다!BE Aws ec2 배포 과정 중에 궁금한 점이 생겨서 질문드립니다. 보통 웹에서는 프론트 주소를 백엔드 ec2 인바운드 규칙에 넣어서 그 주소의 api요청만 허용하게 해, 보안을 강화하는 한편, 앱에서는 웹과 다르게 프론트 배포 주소를 알 수 없는데 이때는 모든 아이피를 허용하게 보안규칙을 넣어야 하나요?만약 그렇게하면 악성 유저가 서버 주소를 알아서 악용하는 상황에서는 어떻게 보안을 강화해야할까요? 너무 궁금합니다! 이상입니다. 감사합니다.

isLoggedIn이 false일 때는 Auth네비게이터를 보여주고 이 때는 별 다른 오류가 발생하지 않습니다.하지만 isLoggedIn을 true로 변경 한 후, Drawer 네비게이터를 보여줄 때는 위와 같은 오류가 계속 발생합니다.어디서 타입 에러가 발생하는건지 도저히 모르겠어서 질문을 남깁니다... cf) babel 파일 수정, 캐시 삭제 후 재실행, 안드로이드 에뮬레이터 cold boot 다 시도해봤는데 동일한 문제가 계속 발생합니다.import {createDrawerNavigator} from '@react-navigation/drawer'; import React from 'react'; import MapHomeScreen from '../../screens/MapHomeScreen'; import FeedHomeScreen from '../../screens/FeedHomeScreen'; import CalendarHomeScreen from '../../screens/CalendarHomeScreen'; const Drawer = createDrawerNavigator(); const MainDrawerNavigator = () => { return ( <Drawer.Navigator> <Drawer.Screen name="MapHome" component={MapHomeScreen} /> <Drawer.Screen name="FeedHome" component={FeedHomeScreen} /> <Drawer.Screen name="CalendarHome" component={CalendarHomeScreen} /> </Drawer.Navigator> ); }; export default MainDrawerNavigator; import React from 'react'; import {View, Text} from 'react-native'; interface MapHomeScreenProps {} const MapHomeScreen = ({}: MapHomeScreenProps) => { return ( <View> <Text>MapHomeScreen</Text> </View> ); }; export default MapHomeScreen;

MAC에서 작성한 코드를 윈도우 환경에서 돌려도 문제가 없을까요??서로 환경이 다른 곳에서 작성된 코드들이 문제없이 작동하는지 궁금합니다.

node: nvm으로 여러 node버전을 use명령어로 바꿔가면서 프로젝트마다 버전관리를 하면서 사용할 수 있을 것 같습니다.2. java는 17 버전을 사용합니다 (rn 0.72,0.73 버전과 함께사용할수 있다는 다른분의 질문답변을 봤습니다. )3. react-native를 0.72버전으로 시작하고 싶어서 아래의 명령어로 실행했습니다 -react-native라이브러리 설치E:\RN_PJ>npm i -g react-native E:\RN_PJ>react-native -v 13.6.9-해당 라이브러리로 프로젝트 생성E:\RN_PJ>npx react-native init FoodDeliveryApp --version 0.72 --template react-native-template-typescript프로젝트 생성하는 명령어에서의 에러메세지- 요약하면 version이랑 template이랑 함께 사용할수 없는 명령어라는 내용같습니다.  ⚠️ The `init` command is deprecated. The behavior will be changed on 2024. 12. 31. (131 days). - Switch to npx @react-native-community/cli init for the identical behavior. - Refer to the documentation for information about alternative tools: https://reactnative.dev/docs/getting-started Running: npx @react-native-community/cli init error Passing both "version" and "template" is not supported. The template you select determines the version of react-native used. Please use only one of these options, for example: --template react-native-template-typescript@x.y.z where x.y.z is the release of the template that contains the desired "react-native" version. Check the version tab of https://www.npmjs.com/package/react-native-template-typescript for available versions. info Run CLI with --verbose flag for more details.-chat gpt 는 아래의 명령어를 실행해보라는데 이렇게 시작해도되는지 잘 모르겠습니다. (...)npx react-native init FoodDeliveryApp --version 0.72.0 npx react-native init FoodDeliveryApp --template react-native-template-typescript@X.Y.Z 추가 참고 사항 및 질문사항)현재 node14, java17로 진행하고있는 프로젝트가 있어서java를 17버전으로 진행하려고 했습니다. JAVA_HOME을 17버전으로 잡아놔서... 프로젝트 왓다갔다 할 때마다 JAVA_HOME바꾸는 방법밖에는 모르겠어서 그렇게 하고싶지는 않아가지구... os가 windows인데 nvm처럼 java버전관리 할수있는게 없는것 같습니다...  보통 실무에서 java는 버전 관리를 어떻게 하나요? (도커같은 컨테이너로 프로젝트 별 환경관리를 하지 않을까하는 추측을 하고있습니다.) 따로 관리하는 방법이 있는지 궁금합니다.)

강사님이 알려주신 방식을 듣고 다양한 이미지 처리 방식을 공부하기 위하여 Presigned URL 방식을 구현중에 있습니다. Nest.js 백엔드에 요청을 통해 발급받은 S3 url 주소에 RN환경에서 PUT 요청으로 이미지를 업로드하고 있습니다. 이 떄, 일반적인 form-data 형식은 들어가지지 않는 것 같은데, binary 형태는 매우 잘 들어가집니다.현업에서도 presigned-url을 활용할 떄 binary 형태로만 전달을 해야하나요, 아니면 다른 방식이 있는지 알고 싶어 식견을 구하고자, 질문드립니다!!또, RN에서 Binary 형태를 만드는 방법이 쉽지 않아보여, 어떻게 하는게 좋은 방식인지 알고싶습니다!

윈도우 amd 안드로이드 환경입니다react-native doctor를 했을땐 이상이 없는데npm start 했을 때  Gradle could not start your build. Could not create service of type ChecksumService using BuildSessionScopeServices.createChecksumService(). java.io.FileNotFoundException: C:\Users\project\MatzipApp\android.gradle\8.0.1\checksums\checksums.lock (�׼����� �źεǾ����ϴ�) 이런 오류가 자꾸 뜹니다  

 윈도우, 안드로이드 환경입니다.import React from 'react'; import {Pressable, StyleSheet, Text} from 'react-native'; interface CustomButtonProps{ label: string; variant?: 'filled' | 'outlined'; size?: 'large' | 'medium'; } function CustomButton({ label, variant='filled', size='large', }: CustomButtonProps) { return ( <Pressable style={[styles.container, styles[variant], styles[size]]}> <Text style={[styles.text, styles['${variant}Text']]}>{label}</Text> </Pressable> ) } const styles = StyleSheet.create({ container:{ borderRadius: 3, justifyContent:'center', }, filled: { backgroundColor:'#C63B64' }, outlined: { borderColor:'C63B64', borderWidth: 1, }, large: { width: '100%', paddingVertical: 15, alignItems: 'center', justifyContent: 'center', }, medium: { width: '50%', paddingVertical: 12, alignItems: 'center', justifyContent: 'center', }, text: { fontSize: 16, fontWeight: '700', }, filledText: { color: 'white', }, outlinedText: { color: '#C63B64', }, }); export default CustomButton;styles['${variant}Text' ]이 부분이 에러가 발생하는데 왜그런 것인가요?에러메세지는 다음과 같습니다.[{"resource": "/c:/Users/dcgn6ec/MatzipApp/front/src/components/CustomButton.tsx","owner": "typescript","code": "7053","severity": 8,"message": "Element implicitly has an 'any' type because expression of type '\"${variant}Text\"' can't be used to index type '{ container: { borderRadius: number; justifyContent: \"center\"; }; filled: { backgroundColor: string; }; outlined: { borderColor: string; borderWidth: number; }; large: { width: \"100%\"; paddingVertical: number; alignItems: \"center\"; justifyContent: \"center\"; }; medium: { ...; }; text: { ...; }; filledText: { ...; }; ...'.\n Property '${variant}Text' does not exist on type '{ container: { borderRadius: number; justifyContent: \"center\"; }; filled: { backgroundColor: string; }; outlined: { borderColor: string; borderWidth: number; }; large: { width: \"100%\"; paddingVertical: number; alignItems: \"center\"; justifyContent: \"center\"; }; medium: { ...; }; text: { ...; }; filledText: { ...; }; ...'.","source": "ts","startLineNumber": 18,"startColumn": 36,"endLineNumber": 18,"endColumn": 60}]  

"dependencies": { "@react-navigation/native": "^6.0.6", "@react-navigation/native-stack": "^6.2.5", "react": "18.3.1", "react-native": "0.75.1", "react-native-safe-area-context": "^3.3.2", "react-native-screens": "3.22.1" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/babel-preset": "0.75.1", "@react-native/eslint-config": "0.75.1", "@react-native/metro-config": "0.75.1", "@react-native/typescript-config": "0.75.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.3.1", "typescript": "5.0.4" }, "engines": { "node": ">=18" }"bubblingEventTypes of null error" 에러가 발생합니다.버전문제라고 생각해서 버전을 계속 바꿔봤는데도 안되네여..

이런게 뜨는데 npm라이브러리가 잘못된건가요? react-native-cli라 expo라이브러리를 쓸수도 없고...