묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
[해결 방법] android 빌드 방법
계속 까먹네요 ㅠ^ㅠ 참고~!!cd android ./gradlew build
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
스웨거 문서에 Basic, Bearer를 적용하는 방법에 대해 질문 드립니다.
AccessToken, RefreshToken 강의 내용을 모두 마친 후에 스웨거 문서 작성 방법에 대해 궁금한 점이 있어 질문 드립니다. @Headers()를 사용하여 rawToken 값을 전달하는 경우 스웨거 문서에서는 다음과 같이 @ApiBasicAuth('basic'), @ApiBearerAuth('bearer') 형식을 작성을 해야하는지 질문 드립니다. import { Body, Controller, Headers, Post, UseGuards } from '@nestjs/common'; import { AuthFacade } from '@root/resource/auth/auth.facade'; import { BasicTokenGuard } from '@root/common/guard/basic-token.guard'; import { RefreshTokenGuard } from '@root/common/guard/bearer-token.guard'; import { IsPublic } from '@root/common/decorator/is-public.decorator'; import { ApiBasicAuth, ApiBearerAuth, ApiOkResponse, ApiOperation, ApiTags } from '@nestjs/swagger'; import { AccessAndRefreshTokenResponse, AccessTokenResponse, RefreshTokenResponse, } from '@root/resource/auth/dto/response/token-response.dto'; @ApiTags('Auth API') @Controller('v1/auth') export class AuthController { constructor(private readonly authFacade: AuthFacade) {} @ApiOperation({ summary: '로그인', description: 'Authorization Basic 이메일:비밀번호 방식으로 로그인합니다.' }) @ApiBasicAuth('basic') @ApiOkResponse({ type: AccessAndRefreshTokenResponse }) @IsPublic() @UseGuards(BasicTokenGuard) @Post('login') async login(@Headers('authorization') rawToken: string) { return await this.authFacade.loginWithEmail(rawToken); } @ApiOperation({ summary: '회원가입', description: '이메일, 비밀번호로 회원가입을 진행합니다.' }) @ApiOkResponse({ type: AccessAndRefreshTokenResponse }) @IsPublic() @Post('register') async register(@Body('email') email: string, @Body('password') password: string) { return await this.authFacade.registerWithEmail(email, password); } @ApiOperation({ summary: 'AccessToken 갱신', description: 'RefreshToken으로 AccessToken을 갱신합니다.' }) @ApiBearerAuth('bearer') @ApiOkResponse({ type: AccessTokenResponse }) @IsPublic() @UseGuards(RefreshTokenGuard) @Post('token/access') generateAccessToken(@Headers('authorization') rawToken: string) { return this.authFacade.generateAccessToken(rawToken); } @ApiOperation({ summary: 'RefreshToken 갱신', description: 'RefreshToken으로 RefreshToken을 갱신합니다.' }) @ApiBearerAuth('bearer') @ApiOkResponse({ type: RefreshTokenResponse }) @IsPublic() @UseGuards(RefreshTokenGuard) @Post('token/refresh') generateRefreshToken(@Headers('authorization') rawToken: string) { return this.authFacade.generateRefreshToken(rawToken); } }
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
카카오 로그인시 url
안녕하세요 선생님카카오톡 로그인 부분에 에러가 있어서 질문 드립니다!! import axios from 'axios'; import {SafeAreaView, StyleSheet, View} from 'react-native'; import Config from 'react-native-config'; import WebView, {WebViewMessageEvent} from 'react-native-webview'; // kakao api 에서 적었던 uri 를 적어준다. const REDIRECT_URI = 'http://localhost:3030/auth/oauth/kakao'; function KakaoLoginScreen() { const handleOnMessage = (event: WebViewMessageEvent) => { console.log('event.nativeEvent.url :', event.nativeEvent.url); if (event.nativeEvent.url.includes(`${REDIRECT_URI}?code=`)) { const code = event.nativeEvent.url.replace(`${REDIRECT_URI}?code=`, ''); console.log('code :', code); requestToken(code); } }; const requestToken = async (code: string) => { const response = await axios({ method: 'post', url: 'https://kauth.kakao.com/oauth/token', params: { grant_type: 'authorization_code', client_id: Config.KAKAO_REST_API_KEY, redirect_uri: REDIRECT_URI, code, }, }); console.log('response.data :', response.data); }; return ( <SafeAreaView style={styles.container}> <WebView source={{ uri: `https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=${Config.KAKAO_REST_API_KEY}&redirect_uri=${REDIRECT_URI}`, }} onMessage={handleOnMessage} injectedJavaScript={"window.ReactNativeWebView.postMessage('')"} /> </SafeAreaView> ); } const styles = StyleSheet.create({ container: { flex: 1, }, }); export default KakaoLoginScreen; 카카오 redirect URI 에서도http://localhost:3030/auth/oauth/kakao입력을 했는데console.log('event.nativeEvent.url :', event.nativeEvent.url);이부분의 로그가 왜 저는https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=해당코드&redirect_uri=http://localhost:3030/auth/oauth/kakao 이렇게 나올까용?그래서 if 문을 타지 ㅇ낳아 requertToken 으로 넘어가지 못하고 있습니다.
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
5-3 강의 질문
5-3 강의에서 HeaderButton 컴포넌트를 만드신 후에, AddPostHeaderRight 컴포넌트에서 HeaderButton 을 호출하셨는데, 혹시 특별한 이유가 있을까요? AddPostScreen 에서 headerRight에 HeaderButton 을 그대로 사용하지 않고, AddPostHeaderRight 를 만드신 점이 궁금합니다. 어떤 것을 구현하는데에는 다양한 방법이 있지만, 강사님이 그렇게 하신 데에 특별한 이유가 있는지, 배울점이 있을 수도 있을것 같아서 질문 드립니다! 강의 2회독 중인데, 저는 useEffect(() => { navigation.setOptions({ headerRight: () => <HeaderButton labelText={'등록'} />, }); }, []);이렇게 하실 줄 알았는데, 한번 더 함수로 랩핑 하셔서 호기심이 생겼습니다.
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
윈도우에서 프로젝트 생성
❗질문 작성시 꼭 참고해주세요최대한 상세히 현재 문제(또는 에러)와 코드(또는 github)를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다.맥/윈도우, 안드로이드/iOS, ReactNative 버전 등의 개발환경도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황을 올려주세요. (일부만 잘라서 올리지 말아주세요.)윈도우라 1-2,1-3은 패스하고 1-4까지 진행했고 1-5를 진행하려고 하는데 강의 환경이 맥이라 햇갈립니다. 윈도우에서는 어떻게 하면 될까요..?
-
미해결[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
'[5-0] 마커 표시하기' <Marker /> 컴포넌트 사용 시 Error 발생
1. '[4-5] GoogleMap 커스텀 스타일 적용하기' 강의까지 문제 없이 진행 후 '[5-0] 마커 표시하기' 강의로 넘어와서 <Marker />컴포넌트를 넣었을 때 발생한 문제입니다. 2. 강의를 따라서 MapHomeScreen.tsx 파일 내 Marker 관련 코드를 동일하게 적용.VScode에서 Error가 발생하지 않아 시뮬레이터를 실행시켰습니다. 3. 시뮬레이터 실행 시 해당 에러 발생.(ios, android 모두 동일한 에러가 지속적으로 나타났습니다.)* <Marker />를 주석처리하면 에러가 나타나지않고, 지도가 잘 나타납니다.react-native 버전과 react-native-maps 버전 문제 확인, npm uninstall react-native-mapsnpm install react-native-maps --save-exact npx pod-install ios등등 여러가지 시도해도 보았습니다.= 에러가 해결되지 않았습니다. 4. 강사님께서 제공해주시는 깃허브 코드 확인.https://github.com/InKyoJeong/Matzip/blob/lecture/5-0/front/src/screens/map/MapHomeScreen.tsx 제공된 코드 전체를 저의 MapHomeScreen.tsx 파일에 붙여넣기 후 VScode 내 Error없음을 확인. npm start --reset-cache로 다시 시뮬레이터 실행. = 해결안됨여전히 시뮬레이터에서 TypeError: this.getNativeComponent is not a function (it is undefined) 에러 발생.. 5. StackOverFlow검색 및 Google검색 결과..StackOverFlow에서는 해결사례를 찾을 수 없었습니다.Google 검색을 통해서도 명확한 해결사례를 찾을 수 없는 상황에서 아래와 같은 사이트에서 제시한 방법을 통해 에러가 더 이상 뜨지 않는 것을 확인하였습니다. 출처 : https://github.com/react-native-maps/react-native-maps/issues/4861 주석처리. 마커가 잘 뜨는 것을 확인. 6. Error가 해결된 것이 맞지만, 잘 못된 방법인 것 같아 질문드립니다.
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
프로젝트 생성시 error bundler: failed to load command: pod
안녕하세요 선생님 선생님의 cli 셋팅을 잘 따라라고마지막으로 프로젝트 생성을 위해 npx react-native@0.72.6 init AwesomeProject --version 0.72.6를 하였는데 설치도중 error bundler: failed to load command: pod 에러가나왔는데 구글링을해봐도 해결이되지 않아서요어떤문제가 있는걸까요?
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
저는 강의와 다르게 prisma를 사용하고 있는데
ConfigModule의 envFilePath에 '.env.development' 을 줬음에도 불구하고 Nest.js가 계속 .env 의 환경변수를 참조하는 현상이 발생하고 있습니다. NODE_ENV=development도 줬구요. 제 생각엔 Prisma가 .env를 참조하기 때문에 해당 설정이 무시되는 거 같은데 어떻게 해결하면 좋을까요? 아무리 검색해도 명쾌한 해결법이 안나와서 이렇게 질문드립니다 ㅠㅠ
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
이미지업로드 동작없음
안녕하세요 강사님제가 이미지 업로드 강의를 따라 구현하고 있는데요사진 추가 버튼을 클릭해도 아무런 액션이 일어나지 않는데혹시 그게 제 pc 가 노트북이 아니라 pc 라서 그런걸까요? 어디까지 접근하는지 보려고log 를 남겼는데 console.log('useImagePicker');로그가 찍히는데console.log('handleChange');해당 부분은 로그가 찍히지 않습니다.AddPostScreen.tsx 에서<ImageInput onChange={iamgePicker.handleChange} />이렇게 onChange 로 호출하는데 혹시 잘못된 부분이 있거나더 살펴봐야될 곳이 있을까요?function useImagePicker({initialImages = []}: ImagePickerProps) { console.log('useImagePicker'); const [imageUris, setImageUris] = useState(initialImages); const uploadImages = useMutateImages(); const addImageUris = (uris: string[]) => { setImageUris(prev => [...prev, ...uris.map(uri => ({uri}))]); }; const handleChange = () => { console.log('handleChange'); ImagePicker.openPicker({ mediaType: 'photo', multiple: true, includeBase64: true, maxFiles: 5, cropperChooseText: '완료', cropperCancelText: '취소', }) .then(images => { const formData = getFormDataImages(images); uploadImages.mutate(formData, { onSuccess: data => addImageUris(data), }); }) .catch(error => { if (error.code !== 'E_PICKER_CANCELLED') { //에러처리 } }); }; return {imageUris, handleChange}; } export default useImagePicker;
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
DrawNavigator 타입 추론
2-5강의 4분정도쯤에 createDrawerNavigator함수를 사용하면 강의에서는 타입을 잘 잡아주지만 저는 반환타입이 any로 잡힙니다. IDE를 껏다켜봐도 변함이없네요.. 뭐가 문제인걸까요?createDrawerNavigator함수: Drawer변수 타입:
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
[5-7] 환경변수 설정하기 android는 되는데 ios는 안돼요 ㅜㅠ
환경변수만 설정이 필요해서 저부분 강의로 보고 따라했는데 android 환경변수를 잘 받아와요.그런데 강의에서도 ios는 따로 설정한 부분이 없어서 똑같이 재빌드만 했는데 undefined 나와요. 다른 곳에서 검색해보면 ios는 xcode 들어가서 추가 설정이 있는데 제가 무엇을 더 해야할까요?ex) https://velog.io/@chloedev/RN [RN] react-native-config 환경변수 사용하기 아니라면 제가 [5-7] 강의 부분 말고 다른 부분도 추가적으로 봐야 ios 환경변수를 적용할 수 있을까요?.evn 설정 android 터미널 ios 터미널
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
ios 캐시 삭제 방법 알 수 있을까요?
아래 방법을 진행하고 앱을 실행해도 앱이 사용자의 위치를 사용하도록 허용하시겠습니까? 라는 알림이 나오지를 않습니다.혹시 방법이 있을까요!? 방법 1.설정 -> 개발자 -> Xcode 프로젝트 빌드 파일 -> 2개 삭제 방법 2.npx react-native start --reset-cache 방법 3.yarn cache clean
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
[해결 방법] Specs satisfying the RNPermissions...
수정 1)Xcode -> IOS Deployment Target 변경 (12.0 -> 13.0) 수정 2)VSC -> Podfile -> 13버전으로 업! platform :ios, '13.0'
-
미해결[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
쿼리러너 대신 @Transactional
안녕하세요.쿼리러너대신 @Transactional을 사용하면 되지않나요?사용안하신 이유가 있나요? nest에서 지원을 안하는것인지?스프링쪽과 같이 공부하다보니 궁금한점이 생겨서 질문드립니다.
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
ios 빌드 시간에 관하여
프로젝트 빌드 시, 안드로이드는 곧바로 시뮬레이터가 열리고 앱이 빌드되는데, iOS는 시뮬레이터가 열리고 시간이 한~~~~~참 지나야 앱이 빌드됩니다. 원래 이렇게 시간차이가 많이나나요? 안드로이드는 1분만에 되는것같던데 iOS는 거의 5분정도 걸리네요.. 참고로 코드는 아무것도 없고 프로젝트 초기화 시 입니다. m1 air 16GB, 512입니다.❗질문 작성시 꼭 참고해주세요최대한 상세히 현재 문제(또는 에러)와 코드(또는 github)를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다.맥/윈도우, 안드로이드/iOS, ReactNative 버전 등의 개발환경도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황을 올려주세요. (일부만 잘라서 올리지 말아주세요.)
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
yarn start. 와 npx react-native run-ios 명령은 다른 건가요?
❗질문 작성시 꼭 참고해주세요최대한 상세히 현재 문제(또는 에러)와 코드(또는 github)를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다.맥/윈도우, 안드로이드/iOS, ReactNative 버전 등의 개발환경도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황을 올려주세요. (일부만 잘라서 올리지 말아주세요.)[2-0] 강좌를 진행중에 있습니다.yarn start 를 실행하면 Welcome 화면이 나오는데..강사님이 실행한 것 처럼 npx react-native run-ios 를 실행하면 bundle error 가 나네요.
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
No bundle URL present 오류는 어떻게 처리해야 할까요?
❗질문 작성시 꼭 참고해주세요최대한 상세히 현재 문제(또는 에러)와 코드(또는 github)를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다.맥/윈도우, 안드로이드/iOS, ReactNative 버전 등의 개발환경도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황을 올려주세요. (일부만 잘라서 올리지 말아주세요.)XCode 로 실행시켜보라는 강사님의 말대로 실행시켜 보았습니다.그런데 이런 오류가 나네요.. jsbundle file을 그냥 생성해주면 되나요? 어떻게 해야하는 걸까요?
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
이거 뭐 아무리 해도 ios 시작도 안되는군요..
❗질문 작성시 꼭 참고해주세요최대한 상세히 현재 문제(또는 에러)와 코드(또는 github)를 첨부해주셔야 그만큼 자세히 답변드릴 수 있습니다.맥/윈도우, 안드로이드/iOS, ReactNative 버전 등의 개발환경도 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황을 올려주세요. (일부만 잘라서 올리지 말아주세요.)이거 뭐 이렇게 어려워서야...하라는 대로 해도 안되고 밀고 해도 안되고. ㅎㅎㅎㅎㅎㅎㅎ
-
해결됨[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
android codepush 관련 질문입니다.
안녕하세요, 강사님 제가 강사님 강의를 보고, CODEPUSH를 적용해보고자하는데,제가 만약에 .env에CODEPUSH_ANDROID_APP_SECRET=adsfasdfas이렇게 환경변수로 정의했다고 하면,appcenter-config.json 파일에서 이렇게 해도 인식이 될까요?```json{ "app_secret": "{CODEPUSH_ANDROID_APP_SECRET}" }```아니면, 이런 코드푸시 키는, 그냥 깃허브에 공개해도 상관없는지가 궁금합ㄴ디ㅏ!
-
미해결[리뉴얼] 맛집 지도앱 만들기 (React Native & NestJS)
[해결 완료] ios 실행 시 빌드 오류
안녕하세요 강사님안드로이드 버전 관련해서 해결 후에ios를 실행할 때 아래와 같이 오류가 발생합니다..ㅜㅜ제가 아무래도 이전에 아래와 같은 명령어를 실행했던게 문제가 되지 않았을까 추측이 됩니다..ㅠㅠ혹시 어떤 문제가 발생한걸까요.. yarn remove react-native-maps 실행yarn add react-native-maps@1.8.3 실행node_modules 디렉터리 삭제yarn 명령으로 패키지 설치npx pod-install ios 실행cd android 명령으로 android 디렉터리 이동rm -rf .gradle 실행./gradlew clean 실행npm run android, npm run ios 로 재빌드하여 실행 시도 1cd iosrm -rf Podsrm -rf Podfile.lockpod installXcode -> Product -> Clean build folder -> xcode 18버전 업그레이드시도 218버전 업그레이드 후에 발생하는 오류입니다..ㅠㅠ아래 블로그 내용을 보았지만 use_flipper라는 텍스트가 존재하지 않습니다..ㅠㅠhttps://positiveko-til.vercel.app/til/react-native/flipper-error.html