묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결배달앱 클론코딩 [with React Native]
잘못된 클라이언트 ID를 지정
1.ios/FoodDeliveryApp/Info.plist 입력<key>NMFClientId</key> <string>콘솔에서 복사한 클라이언트 아이디</string>2.Xcode의 앱-general-Bundle Identifier과 네이버 콘솔 번들 ID 동일 (잘못입력했을까봐 복사붙여넣어서도 시도해보았습니다)3. pod install --repo-update npx pod-installXcode에서 shift+cmd+k로 build clean위 사항들을 모두 시도해보았는데 ios에서만 아래 얼럿창이 발생합니다. (android는 정상동작) 오탈자 및 확인할 수 있는 사항 모두 확인하였는데 해결이 잘 안되어 질문드립니다.
-
미해결배달앱 클론코딩 [with React Native]
redux state에 push
리액트에 state값을 변경할때 직접 수정하면 감지하지 못한다고 알고 있었는데 (ex. state.count = 10) push 같은 행위는 상관 없는 걸까요? 아니면 애초에 잘못된 정보 였을까요?
-
해결됨배달앱 클론코딩 [with React Native]
로그인 페이지 내 useCallback 사용 이유
안녕하세요, RN보다는 React에 가까운 질문 같긴하지만 궁금한 점이 있어서요.제로조님께서 로그인 페이지 내에서 onSubmit 함수나 onChangeEmail, onChangePassword 함수에 useCallback을 사용하셨는데 이유가 있을까요??useCallback이 재랜더링 시 불필요하게 계속 호출되는 것을 막는 것으로 알고 있는데, 해당 페이지 내에서는 재랜더링 되는 것이 없어서 불필요한 것이 아닌가 싶어서요. 물론 useCallback없이 써도 되는 것은 알지만, 해당 부분에서 제로조님께서 useCallback을 사용하시는 이유가 궁금합니다! 감사합니다!
-
미해결배달앱 클론코딩 [with React Native]
안드로이드 앱을 실행하면 바로꺼집니다.
안녕하세요 강사님지금 리액트 내비게이션 만들기를 하고 있습니다.지금 App.tsx를 교체를 했는데 앱을 실행했을 때 바로 종료가 됩니다.gif 사진을 달아놨습니다. import * as React from 'react'; import {NavigationContainer, ParamListBase} from '@react-navigation/native'; import { createNativeStackNavigator, NativeStackScreenProps, } from '@react-navigation/native-stack'; import {Text, TouchableHighlight, View} from 'react-native'; import {useCallback} from 'react'; type RootStackParamList = { Home: undefined; Details: undefined; }; type HomeScreenProps = NativeStackScreenProps<RootStackParamList, 'Home'>; type DetailsScreenProps = NativeStackScreenProps<ParamListBase, 'Details'>; function HomeScreen({navigation}: HomeScreenProps) { const onClick = useCallback(() => { navigation.navigate('Details'); }, [navigation]); return ( <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}> <TouchableHighlight onPress={onClick}> <Text>Home Screen</Text> </TouchableHighlight> </View> ); } function DetailsScreen({navigation}: DetailsScreenProps) { const onClick = useCallback(() => { navigation.navigate('Home'); }, [navigation]); return ( <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}> <TouchableHighlight onPress={onClick}> <Text>Details Screen</Text> </TouchableHighlight> </View> ); } const Stack = createNativeStackNavigator<RootStackParamList>(); function App() { return ( <NavigationContainer> <Stack.Navigator initialRouteName="Home"> <Stack.Screen name="Home" component={HomeScreen} options={{title: 'Overview'}} /> <Stack.Screen name="Details"> {props => <DetailsScreen {...props} />} </Stack.Screen> </Stack.Navigator> </NavigationContainer> ); } export default App;
-
미해결배달앱 클론코딩 [with React Native]
EncryptedStorage에 저장되는 값을 확인하고 싶습니다.
로그인 유지가 되지 않는 것 같아서 storage의 저장하는 되는 값을 확인하고 싶습니다.재로딩 시 로그인이 끊기는 현상이 있어 accessToken과 refreshToken을 확인하고 싶습니다. const onSubmit = useCallback(async () => { if (loading) { return; } if (!email || !email.trim()) { return Alert.alert('알림', '이메일을 입력해주세요.'); } if (!password || !password.trim()) { return Alert.alert('알림', '비밀번호를 입력해주세요.'); } try { setLoading(true); const response = await axios.post(`${Config.API_URL}/login`, { email, password, }); Alert.alert('알림', '로그인 되었습니다.'); dispatch( userSlice.actions.setUser({ name: response.data.data.name, email: response.data.data.email, accessToken: response.data.data.accessToken, }), ); await EncryptedStorage.setItem( 'refreshToken', response.data.data.refreshToken, ); } catch (error) { const errorResponse = (error as AxiosError).response; if (errorResponse) { Alert.alert('알림', errorResponse.data.message); } } finally { setLoading(false); } }, [loading, dispatch, email, password]);로그인은 정상적으로 되었고 오더페이지로 넘어 간 상태입니다 "react-native-encrypted-storage": "^4.0.3",의심되는 부분은 강의에서 설치한 버전 차이가 있는데 "4.0.2" 버전으로 설치 시 에러가 있어서 "4.0.3" 버전을 사용중입니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
postman에서 no environment
postman에서 우측 상단의 no environment를 클릭해도다른 항목이 나오지 않습니다.
-
미해결배달앱 클론코딩 [with React Native]
icon font 사이즈 조정방법
headerTitle은 위쪽tabBarLabelStyle 은 아래쪽 fontSize 조정가능하십니다.
-
미해결배달앱 클론코딩 [with React Native]
Type '({ navigation }: HomeScreenProps) => Element' is not assignable to type 'ScreenComponentType<ParamListBase, "Home"> | undefined'. 에러
(property) component: ScreenComponentType<ParamListBase, "Home">React component to render for this screen.Type '({ navigation }: HomeScreenProps) => Element' is not assignable to type 'ScreenComponentType<ParamListBase, "Home"> | undefined'. Type '({ navigation }: HomeScreenProps) => Element' is not assignable to type 'FunctionComponent<{}>'. Types of parameters '__0' and 'props' are incompatible. Type '{}' is missing the following properties from type 'HomeScreenProps': navigation, routets(2322)types.d.ts(327, 5): The expected type comes from property 'component' which is declared here on type 'IntrinsicAttributes & RouteConfig<ParamListBase, "Home", StackNavigationState<ParamListBase>, NativeStackNavigationOptions, NativeStackNavigationEventMap>'git에 있는 코드를 복사해 붙여넣기 하였는데 이러한 에러가 나옵니다... 혹시 어떻게 하면 될까요?
-
미해결배달앱 클론코딩 [with React Native]
비디오 재생 질문입니다.
혹시 mp4 형태의 비디오 파일은 어떻게 접근할 수 있을까요?? filePath 는 출력이 되는데, {uri: filePath} 형태로 지정해도 파일을 읽지 못합니다...비디오 재생용 라이브러리는 react-native-video 사용하고 있습니다.
-
미해결배달앱 클론코딩 [with React Native]
이건 강의내용 외 질문인데, ftp 나 sftp 프로토콜을 통하여 서버에 파일을 업로드 하게 될 경우는 웹과 앱의 동작 방식이 다른지 여쭤보고 싶습니다.
웹 프론트엔드 같은 경우는, 서버에 별도 배포과정을 거쳐 API 호출 방식과 유사하게 처리할 수 있는것 같던데, 앱애서는 이러한 배포방식을 사용할 수 없어, 어떻게 처리해야 하는지 감을 잡지 못하겠어 여쭤봅니다..감사합니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
다른건 다되는데 typeerror 가 뜹니다..
1.<pre>TypeError: Cannot read properties of undefined (reading 'create')const express = require("express"); const cors = require("cors"); const { application } = require("express"); const app = express(); const port = 8080; const models = require("./models"); app.use(express.json()); app.use(cors()); app.get("/products", (req, res) => { const query = req.query; console.log("QUERY:", query); res.send({ products: [ { id: 1, name: "농구공", price: 100000, seller: "조던", imgUrl: "images/products/basketball1.jpeg", }, { id: 2, name: "축구공", price: 50000, seller: "메시", imgUrl: "images/products/soccerball1.jpg", }, { id: 3, name: "키보드", price: 10000, seller: "그랩", imgUrl: "images/products/keyboard1.jpg", }, ], }); }); app.post("/products", (req, res) => { const body = req.body; const { name, description, price, seller } = body; models.Product.create({ name, description, price, seller, }) .then((result) => { console.log("상품 생성 결과 : ", result); res.send({ result, }); }) .catch((error) => { console.error(error); res.send("상품 업로드에 문제가 생겼습니다."); }); }); app.get("/products/:id/events/:eventId", (req, res) => { const params = req.params; const { id } = params; res.send(); }); app.listen(port, () => { console.log("그랩의 쇼핑몰 서버가 돌아가고 있습니다."); models.sequelize .sync() .then(() => { console.log("DB 연결 성공"); }) .catch((err) => { console.error(err); console.log("DB 연결 에러 ㅠ "); process.exit(); }); }); 그 전까진 다 실행 잘되고 테이블도 잘 만들어졌는데 postman 에 send 를 누르면 이렇게 나옵니다body 안에는 잘 들어가는데 create 에서 문제가 생긴거 같습니다. ㅠㅠ
-
미해결배달앱 클론코딩 [with React Native]
"RNSScreenStackHeaderConfig" was not found in the UIManager
이러한 에러가 발생합니다.. 계속 리로드 해봐도 같은 증상이 나옵니다..
-
미해결
react-native cli 에서 카카오맵 사용하는 방법이 궁금합니다.
react-native cli를 처음 사용해보고 있습니다. 구글맵같은 경우는 구글맵 플러그인? 라이브러리? 가 있어 편하게 사용했는데요 카카오지도를 사용해야하는데 카카오지도는 웹뷰방식말고 리액트네이티브 로직 안에서 불러오는 방법이 있을까요??
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
안녕하세요! useParams에서 막혀서 질문 남깁니다 ㅠㅠ
우선 웹라이브러리 파트의 Link태그 적용 강의에서 후반부에 useParams 를 사용하게 되는데, 이부분부터 무언가 오류가 발생하네요.. 1. 메인화면 들어갔을때 오류화면 2. 상품클릭했을때 콘솔로그 상품을 클릭했을때 변경된 주소까지는잘 적용 되고, useParams 를 사용하기 전까지는 정상 작동 했는데, product 폴더의 index.js 에 useParams 만 넣으면 위처럼 오류가 발생합니다 이전에 소스에서는 문제가 안생겼군요 ㅠㅠ import { useParams } from "react-router-dom"; function ProductPage() { const { id } = useParams(); return <h1>상품 상세 페이지 {id} 상품</h1>; } export default ProductPage; 오타가 있나 싶어서 소스자료 복붙해도 마찮가지여서 문의로 남깁니다... react-router-dom 설치 할때 버전을 확인 못하고 그냥 설치했다가 나중에 확인해서 5.2 버전으로 다시 설치했는데, package.json 에는 5.2버전으로 정상적으로 보여지긴 하는데 오류내용이 버전이 충돌이 나서 그런건가 싶기도 하고.. 해결 방법이 있을까요? ㅠㅠ
-
미해결배달앱 클론코딩 [with React Native]
npm run android 시 빌드 에러
빌드 할때 에러로 진행이 어렵네요 ㅠ 도와주세요
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
에러가 납니다ㅜㅜ
강의를 보며 그대로 따라했는데 const query = req.query; console.log("QUERY : ", query); 를 추가했을때 터미널에 node server.js를 하면 에러가 납니다ㅜㅜ
-
미해결배달앱 클론코딩 [with React Native]
ios 빌드 오류
2022년 7월 3일자 네이버 맵 최신버전 설치 시 3.15.0 버전이 설치 되는데 빌드가 자꾸 안되서 Podfile에 pod 'NMapsMap','3.10.1' 추가해서 구버전으로 재설치하고 빌드하니까 되네요.. 인텔맥쓰고 있으니까 안되시는 분 있으면 과거버전으로 설치해서 진행해보세요.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
소켓 프로그래밍 이란
질문있습니다. 소켓프로그래밍이라 하면 어떤것을 제작하는 것을 의미하나요 어렴풋이 서버 프로그래밍을 얘기하는 것 같은데.... 그리고 서버 어플리케이션을 만드는 것으 이야기하는지 서버의 운영체제를 만드는 것을 이야기하는지 잘 모르겠습니다. 도움말씀 부탁드려요..
-
미해결배달앱 클론코딩 [with React Native]
티맵을 Linking.openURL()로 여는 것은 어떤가요?
간단하게 실험해보니 손쉽게 열렸습니다. const goByTMap = useCallback(async () => { const destinationURL = 'tmap://route?goalname=분당서울대병원&goalx=127.122930&goaly=37.351987' if (await Linking.canOpenURL(destinationURL)) await Linking.openURL(destinationURL) }, []) 네이티브 소스를 수정해서 브릿징하는 연습을 해본 것은 너무 좋았습니다. 이런 교육적 의도 말고도 url scheme을 Linking으로 여는 것에 어떤 맹점이 있나요? 가령 url scheme이 변경될 소지가 있더던지? 보안이나 다른 문제가 있을까요?
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
와.. 여기서 1도 못하겠어요 ㅠㅠ
버전이 달라서 그런지 인터페이스도 다르고 메뉴도 다른 것 같아요 AVD Manager도 보이지 않고요 ㅠ 어떻게 해야 할지 모르겠습니다