173만명의 커뮤니티!! 함께 토론해봐요.
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
2024-04-02 시작으로.. 2024-12-08 강의 완강하였습니다ㅠㅠ 앱, 프론트 개발이 완전 처음이라 얼마나 헤맸는지.. 강사님과 수강자분들의 도움이 없었으면 다음 생에도 완강을 못했을 수도 있지 않았을까 생각이 드네요.... 수많은 질문 속에서도 답변 주셔서 이렇게 마무리하게 되었습니다. 강의 듣는동안 너무 재밌게 진행하였고 다음 강의가 나온다면 결제 준비하겠습니다 ㅎ0ㅎ 고생하셨습니다 강사님 그리고 감사합니다~~! 🙇♂
해결됨
Next.js App router 기반 Chat GPT 만들기
여기도 하나 질문 드릴게 있는데 conversation.ts파일이 'use server'로인해 서버에서 실행되는 함수가 되는데 그럼에도 revalidatePath함수에 절대경로 ('localhost:3000/')이 아닌 루트경로를 넣어도 왜 상관이 없는건지 궁금합니다 ㅠㅠ
해결됨
Next.js App router 기반 Chat GPT 만들기
클라이언트 컴포넌트안의 자식컴포넌트들은 자동으로 클라이언트 컴포넌트로 바뀌는데 사용할 자식 컴포넌트를 children으로 처리하면 클라이언트 컴포넌트로 바뀌지 않고 서버컴포넌트로 남기때문에 문제가 발생하지 않는건가요? 그렇다면 그게 가능한 메커니즘은 무엇인지 궁금합니다 ㅠㅠ
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
제가 MacOS가 아니라 Windows인데 강의를 원활하게 수강할 수 있나요?
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
방금 강의 결제해서 시작하고 있는데, 처음부터 안 되네요. 사진 첨부합니다!
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
안녕하세요 강사님. 그동안 로그인 구현을 해본적이 없어서 정말 유익한 강의였습니다. 3-8 강의를 듣던 중 강의대로 했는데 로그아웃이 안 되더라구요. 혼자 해결해보려고 다양한 방법으로 해서 결국 로그인과 로그아웃이 동작은 하는데 로그아웃 버튼을 두 번 클릭해야지 AuthStackNavigator로 네비게이팅이 되는 문제가 있습니다. https://github.com/G0MTENG/MatzipApp-project/tree/3-8 깃허브에 3-8 브랜치에 올려두었습니다. src/hooks/queries/useAuth에 이에 대한 구현이 있고 추가적으로 useAuth 코드를 올려두겠습니다. 감사합니다. import { getAccessToken, postLogin, postSignUp, getProfile, logout, } from '@/apis'; import {queryClient} from '@/apis/queryClient'; import {authQueryKeys, storageKeys, numbers} from '@/constants'; import {UseMutationCustomOptions, UseQueryCustomOptions} from '@/types'; import { removeEncryptStorage, removeHeader, setEncryptStorage, setHeader, } from '@/utils'; import {useMutation, useQuery} from '@tanstack/react-query'; import {useEffect} from 'react'; export const useSignUp = (mutationOptions?: UseMutationCustomOptions) => { return useMutation({ mutationFn: postSignUp, ...mutationOptions, }); }; export const useLogin = (mutationOptions?: UseMutationCustomOptions) => { return useMutation({ mutationFn: postLogin, onSuccess: ({accessToken, refreshToken}) => { setEncryptStorage('refreshToken', refreshToken); setHeader('Authorization', `Bearer ${accessToken}`); }, onSettled: () => { queryClient.refetchQueries({ queryKey: [authQueryKeys.AUTH, authQueryKeys.GET_ACCESS_TOKEN], }); queryClient.invalidateQueries({ queryKey: [authQueryKeys.AUTH, authQueryKeys.GET_PROFILE], }); }, ...mutationOptions, }); }; export const useGetRefreshToken = () => { const {data, isSuccess, isError} = useQuery({ queryKey: [authQueryKeys.AUTH, authQueryKeys.GET_ACCESS_TOKEN], queryFn: getAccessToken, staleTime: numbers.ACCESS_TOKEN_REFRESH_TIME, refetchInterval: numbers.ACCESS_TOKEN_REFRESH_TIME, refetchOnReconnect: true, refetchIntervalInBackground: true, }); useEffect(() => { if (isSuccess) { setHeader('Authorization', `Bearer ${data.accessToken}`); setEncryptStorage(storageKeys.REFRESH_TOKEN, data.refreshToken); } }, [isSuccess, data]); useEffect(() => { if (isError) { removeEncryptStorage(storageKeys.REFRESH_TOKEN); removeHeader('Authorization'); } }, [isError]); return {isSuccess, isError}; }; export const useGetProfile = (quryOptions?: UseQueryCustomOptions) => { return useQuery({ queryKey: [authQueryKeys.AUTH, authQueryKeys.GET_PROFILE], queryFn: getProfile, ...quryOptions, }); }; export const useLogout = (mutationOptions?: UseMutationCustomOptions) => { return useMutation({ mutationFn: logout, onSuccess: async () => { await removeEncryptStorage(storageKeys.REFRESH_TOKEN); removeHeader('Authorization'); }, onSettled: () => { queryClient.resetQueries({queryKey: [authQueryKeys.AUTH]}); queryClient.invalidateQueries({queryKey: [authQueryKeys.AUTH]}); }, ...mutationOptions, }); }; export const useAuth = () => { const signupMutation = useSignUp(); const refreshTokenQuery = useGetRefreshToken(); const getProfileQuery = useGetProfile({ enabled: refreshTokenQuery.isSuccess, }); const isLogin = getProfileQuery.isSuccess; const loginMutation = useLogin(); const logoutMuatation = useLogout(); return { signupMutation, loginMutation, isLogin, getProfileQuery, logoutMuatation, }; };
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
환경 : 맥, 안드로이드 버전 : react-native 0.72.6 node 22.11.0 깃허브 : https://github.com/taeyun01/react-native-map 안녕하세요! 2-5 강의 질문도 보고 구글에도 쳐보고 했지만 계속 해결이 안되어 문의 드립니다 ㅠ 시도해본것 node_modules 삭제 Drawer Navigator 패키지 삭제 후 재설치 설치 후 npx react-native run-ios yarn install react-native-reanimated/plugin 추가 npx react-native start --reset-cache 터미널 에러 전체 (에러가 너무 길어 작성이 안되어 메모장 링크로 첨부드립니다.) https://n.lrl.kr/NkN4aH 안드로이드 에뮬레이터 화면 에러 package.json { "name": "foodMap", "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-masked-view/masked-view": "^0.3.2", "@react-navigation/drawer": "^7.0.11", "@react-navigation/native": "^7.0.4", "@react-navigation/stack": "^7.0.6", "react": "18.2.0", "react-native": "0.72.6", "react-native-gesture-handler": "^2.21.2", "react-native-reanimated": "^3.16.2", "react-native-safe-area-context": "^4.14.0", "react-native-screens": "^4.3.0" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/eslint-config": "^0.72.2", "@react-native/metro-config": "^0.72.11", "@tsconfig/react-native": "^3.0.0", "@types/react": "^18.0.24", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.2.1", "eslint": "^8.19.0", "jest": "^29.2.1", "metro-react-native-babel-preset": "0.76.8", "prettier": "^2.4.1", "react-test-renderer": "18.2.0", "typescript": "4.8.4" }, "engines": { "node": ">=16" } }
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
환경: mac m1 npx react-native start --reset-cache를 했는데 (node:73693) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead. (Use `node --trace-deprecation ...` to show where the warning was created) ▒▒▓▓▓▓▒▒ ▒▓▓▓▒▒░░▒▒▓▓▓▒ ▒▓▓▓▓░░░▒▒▒▒░░░▓▓▓▓▒ ▓▓▒▒▒▓▓▓▓▓▓▓▓▓▓▓▓▒▒▒▓▓ ▓▓░░░░░▒▓▓▓▓▓▓▒░░░░░▓▓ ▓▓░░▓▓▒░░░▒▒░░░▒▓▒░░▓▓ ▓▓░░▓▓▓▓▓▒▒▒▒▓▓▓▓▒░░▓▓ ▓▓░░▓▓▓▓▓▓▓▓▓▓▓▓▓▒░░▓▓ ▓▓▒░░▒▒▓▓▓▓▓▓▓▓▒░░░▒▓▓ ▒▓▓▓▒░░░▒▓▓▒░░░▒▓▓▓▒ ▒▓▓▓▒░░░░▒▓▓▓▒ ▒▒▓▓▓▓▒▒ warning: the transform cache was reset. Welcome to Metro v0.76.8 Fast - Scalable - Integrated r - reload the app d - open developer menu i - run on iOS a - run on Android warning: Watchman `watch-project` returned a warning: Recrawled this watch 1 time, most recently because: MustScanSubDirs UserDroppedTo resolve, please review the information on https://facebook.github.io/watchman/docs/troubleshooting.html#recrawl To clear this warning, run: `watchman watch-del '/Users/teng/MatzipApp' ; watchman watch-project '/Users/teng/MatzipApp'` warning: Watchman `query` returned a warning: Recrawled this watch 1 time, most recently because: MustScanSubDirs UserDroppedTo resolve, please review the information on https://facebook.github.io/watchman/docs/troubleshooting.html#recrawl To clear this warning, run: `watchman watch-del '/Users/teng/MatzipApp' ; watchman watch-project '/Users/teng/MatzipApp'` Recrawled this watch 1 time, most recently because: MustScanSubDirs UserDroppedTo resolve, please review the information on https://facebook.github.io/watchman/docs/troubleshooting.html#recrawl To clear this warning, run: `watchman watch-del '/Users/teng/MatzipApp' ; watchman watch-project '/Users/teng/MatzipApp'` Recrawled this watch 1 time, most recently because: MustScanSubDirs UserDroppedTo resolve, please review the information on https://facebook.github.io/watchman/docs/troubleshooting.html#recrawl To clear this warning, run: `watchman watch-del '/Users/teng/MatzipApp' ; watchman watch-project '/Users/teng/MatzipApp'` info Opening the app on Android... info JS server already running. info Launching emulator... info Successfully launched emulator. info Installing the app... > Task :gradle-plugin:compileKotlin UP-TO-DATE > Task :gradle-plugin:compileJava NO-SOURCE > Task :gradle-plugin:pluginDescriptors UP-TO-DATE > Task :gradle-plugin:processResources UP-TO-DATE > Task :gradle-plugin:classes UP-TO-DATE > Task :gradle-plugin:jar UP-TO-DATE > Task :gradle-plugin:inspectClassesForKotlinIC UP-TO-DATE > Configure project :react-native-reanimated Android gradle plugin: 7.4.2 Gradle: 8.0.1 WARNING: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. (생략) > Task :react-native-gesture-handler:compileDebugLibraryResources > Task :app:mergeDebugResources > Task :app:processDebugMainManifest > Task :app:processDebugManifest > Task :app:processDebugManifestForPackage > Task :react-native-gesture-handler:parseDebugLocalResources > Task :react-native-masked-view_masked-view:compileDebugLibraryResources > Task :react-native-reanimated:parseDebugLocalResources > Task :react-native-reanimated:compileDebugLibraryResources > Task :react-native-masked-view_masked-view:parseDebugLocalResources > Task :react-native-safe-area-context:compileDebugLibraryResources > Task :react-native-safe-area-context:parseDebugLocalResources > Task :react-native-gesture-handler:generateDebugBuildConfig > Task :react-native-reanimated:generateDebugBuildConfig > Task :react-native-screens:compileDebugLibraryResources > Task :react-native-reanimated:packageNdkLibs NO-SOURCE > Task :react-native-reanimated:javaPreCompileDebug > Task :react-native-gesture-handler:javaPreCompileDebug > Task :react-native-masked-view_masked-view:generateDebugBuildConfig > Task :react-native-masked-view_masked-view:javaPreCompileDebug > Task :react-native-safe-area-context:generateDebugBuildConfig > Task :react-native-safe-area-context:javaPreCompileDebug > Task :react-native-screens:generateDebugBuildConfig > Task :react-native-screens:javaPreCompileDebug > Task :react-native-screens:parseDebugLocalResources > Task :app:mergeDebugShaders UP-TO-DATE > Task :app:compileDebugShaders NO-SOURCE > Task :app:generateDebugAssets UP-TO-DATE > Task :react-native-gesture-handler:mergeDebugShaders > Task :react-native-gesture-handler:compileDebugShaders NO-SOURCE > Task :react-native-gesture-handler:generateDebugAssets UP-TO-DATE > Task :react-native-gesture-handler:packageDebugAssets > Task :react-native-masked-view_masked-view:mergeDebugShaders > Task :react-native-masked-view_masked-view:compileDebugShaders NO-SOURCE > Task :react-native-masked-view_masked-view:generateDebugAssets UP-TO-DATE > Task :react-native-masked-view_masked-view:packageDebugAssets > Task :react-native-reanimated:mergeDebugShaders > Task :react-native-reanimated:compileDebugShaders NO-SOURCE > Task :react-native-reanimated:generateDebugAssets UP-TO-DATE > Task :react-native-reanimated:packageDebugAssets > Task :react-native-safe-area-context:mergeDebugShaders > Task :react-native-safe-area-context:compileDebugShaders NO-SOURCE > Task :react-native-safe-area-context:generateDebugAssets UP-TO-DATE > Task :react-native-safe-area-context:packageDebugAssets > Task :react-native-screens:mergeDebugShaders > Task :react-native-screens:compileDebugShaders NO-SOURCE > Task :react-native-screens:generateDebugAssets UP-TO-DATE > Task :react-native-screens:packageDebugAssets > Task :react-native-reanimated:generateDebugRFile > Task :react-native-safe-area-context:generateDebugRFile > Task :app:mergeDebugAssets UP-TO-DATE > Task :react-native-masked-view_masked-view:generateDebugRFile > Task :react-native-screens:generateDebugRFile > Task :react-native-gesture-handler:generateDebugRFile > Task :react-native-reanimated:compileDebugJavaWithJavac FAILED Deprecated Gradle features were used in this build, making it incompatible with Gradle 9.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/8.0.1/userguide/command_line_interface.html#sec:command_line_warnings 82 actionable tasks: 70 executed, 12 up-to-date info 💡 Tip: Make sure that you have set up your development environment correctly, by running react-native doctor. To read more about doctor command visit: https://github.com/react-native-community/cli/blob/main/packages/cli-doctor/README.md#doctor /Users/teng/MatzipApp/frontend/node_modules/react-native-reanimated/android/src/main/java/com/swmansion/reanimated/NodesManager.java:440: error: switch rules are not supported in -source 11 case "opacity" -> { ^ (use -source 14 or higher to enable switch rules) /Users/teng/MatzipApp/frontend/node_modules/react-native-reanimated/android/src/main/java/com/swmansion/reanimated/layoutReanimation/AnimationsManager.java:356: error: pattern matching in instanceof is not supported in -source 11 if (props.get(Snapshot.TRANSFORM_MATRIX) instanceof ReadableNativeArray matrixArray) { ^ (use -source 16 or higher to enable pattern matching in instanceof) 2 errors FAILURE: Build failed with an exception. * What went wrong: Execution failed for task ':react-native-reanimated:compileDebugJavaWithJavac'. > Compilation failed; see the compiler error output for details. * 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 BUILD FAILED in 34s info Run CLI with --verbose flag for more details. 위와 같이 에러가 발생합니다. Drawer를 설치한 이후부터 계속 막히네요 ... `plugins: ['react-native-reanimated/plugin'],`도 했습니다. 추가적으로 다른 질문들도 봤는데 다 해결이 안 됐습니다 ㅜㅜ
미해결
맛집 지도앱 만들기 (React Native & NestJS)
❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. npx react-native를 통해 프로젝트를 다운로드 하는데 ✖ Installing CocoaPods error error Installing Cocoapods failed. This doesn't affect project initialization and you can safely proceed. However, you will need to install Cocoapods manually when running iOS, follow additional steps in "Run instructions for iOS" section. Error: An error occured while trying to install CocoaPods, which is required by this template. Please try again manually: sudo gem install cocoapods. CocoaPods documentation: https://cocoapods.org/ 다음과 같은 에러가 발생했습니다. >> sudo gem install cocoapods Password: ERROR: Error installing cocoapods: The last version of drb (>= 0) to support your Ruby & RubyGems was 2.0.6. Try installing it with `gem install drb -v 2.0.6` and then running the current command again drb requires Ruby version >= 2.7.0. The current ruby version is 2.6.10.210 수동으로 설치했는데 안 돼서 ruby 버전을 봤는데 >> ruby -v ruby 2.6.10p210 (2022-04-12 revision 67958) [universal.arm64e-darwin24] 루비를 2.7 버전 이상으로 만들어주기 위해 rbenv를 다운받고 rbenv install -l 3.1.6 3.2.6 3.3.6 jruby-9.4.9.0 mruby-3.3.0 picoruby-3.0.0 truffleruby-24.1.1 truffleruby+graalvm-24.1.1 rbenv install 3.3.6 ruby-build: using openssl@3 from homebrew ==> Downloading ruby-3.3.6.tar.gz... -> curl -q -fL -o ruby-3.3.6.tar.gz https://cache.ruby-lang.org/pub/ruby/3.3/ruby-3.3.6.tar.gz % Total % Received % Xferd Average Speed Time Time Time Current Dload Upload Total Spent Left Speed 100 21.1M 100 21.1M 0 0 2434k 0 0:00:08 0:00:08 --:--:-- 2470k ==> Installing ruby-3.3.6... ruby-build: using libyaml from homebrew ruby-build: using gmp from homebrew -> ./configure "--prefix=$HOME/.rbenv/versions/3.3.6" --with-openssl-dir=/usr/local/opt/openssl@3 --enable-shared --with-libyaml-dir=/usr/local/opt/libyaml --with-gmp-dir=/usr/local/opt/gmp --with-ext=openssl,psych,+ -> make -j 8 *** Following extensions are not compiled: openssl: Could not be configured. It will not be installed. /private/var/folders/yk/px23h3t50fn50y19rbdwp81r0000gn/T/ruby-build.20241124141446.8409.VoUaep/ruby-3.3.6/ext/openssl/extconf.rb:122: OpenSSL library could not be found. You might want to use --with-openssl-dir=<dir> option to specify the prefix where OpenSSL is installed. Check /var/folders/yk/px23h3t50fn50y19rbdwp81r0000gn/T/ruby-build.20241124141446.8409.VoUaep/ruby-3.3.6/ext/openssl/mkmf.log for more details. psych: Could not be configured. It will not be installed. Check /var/folders/yk/px23h3t50fn50y19rbdwp81r0000gn/T/ruby-build.20241124141446.8409.VoUaep/ruby-3.3.6/ext/psych/mkmf.log for more details. BUILD FAILED (macOS 15.1.1 on arm64 using ruby-build 20241105) You can inspect the build directory at /var/folders/yk/px23h3t50fn50y19rbdwp81r0000gn/T/ruby-build.20241124141446.8409.VoUaep See the full build log at /var/folders/yk/px23h3t50fn50y19rbdwp81r0000gn/T/ruby-build.20241124141446.8409.log 이렇게 에러가 발생합니다 .. 이틀째 해결방법을 찾는데 계속 막혀서 글 올립니다 감사합니다 ㅜㅜ
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. Macbook Ari M1 / MacOS 15.0.1 rbenv [루비버전] rbenv install 3.2.2 rbenv: /Users/teng/.rbenv/versions/3.2.2 already exists continue with installation? (y/N) y ruby-build: using openssl@3 from homebrew ==> Downloading ruby-3.2.2.tar.gz... -> curl -q -fL -o ruby-3.2.2.tar.gz https://cache.ruby-lang.org/pub/ruby/3.2/ruby-3.2.2.tar.gz % Total % Received % Xferd Average Speed Time Time Time Current Dload Upload Total Spent Left Speed 100 19.5M 100 19.5M 0 0 16.5M 0 0:00:01 0:00:01 --:--:-- 16.5M ==> Installing ruby-3.2.2... ruby-build: using readline from homebrew ruby-build: using libyaml from homebrew ruby-build: using gmp from homebrew -> ./configure "--prefix=$HOME/.rbenv/versions/3.2.2" --with-openssl-dir=/usr/local/opt/openssl@3 --enable-shared --with-readline-dir=/usr/local/opt/readline --with-libyaml-dir=/usr/local/opt/libyaml --with-gmp-dir=/usr/local/opt/gmp --with-ext=openssl,psych,+ -> make -j 8 BUILD FAILED (macOS 15.0.1 on arm64 using ruby-build 20241105) You can inspect the build directory at /var/folders/yk/px23h3t50fn50y19rbdwp81r0000gn/T/ruby-build.20241123200520.32443.l96uOO See the full build log at /var/folders/yk/px23h3t50fn50y19rbdwp81r0000gn/T/ruby-build.20241123200520.32443.log 이렇게 오류가 발생합니다. 선생님. 2.7.6을 다운로드 했는데 deprecated 됐다고 나오고, 그래서 이 버전으로도 해봤는데 안 되더라구요... 거의 몇시간을 찾는데 관련 글도 안 나옵니다 ㅜㅜ
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
function useLogout(mutationOptions?: UseMutationCustomOptions) { return useMutation({ mutationFn: async () => { await axiosInstance.post('/auth/logout'); // 로그아웃 요청을 서버에 먼저 보냄 removeHeader('Authorization'); await removeEncryptStorage(storageKeys.REFRESH_TOKEN); queryClient.resetQueries({queryKey: [queryKeys.AUTH]}); }, ...mutationOptions }); } 안녕하세요 강사님 강사님의 리액트 네이티브 강의를 보면서 직접 자신만의 리액트 네이티브 프로젝트도 직접 다뤄보면서 하고 있는 학생입니다. https://github.com/Dongrang072/carPoolTeamProject-server 이게 현재 제가 작성하고 있는 로컬 서버의 코드이고 https://github.com/Dongrang072/carpoolTeamProject 이게 프론트의 코드입니다 기존의 로그아웃 코드가 잘 작동하지 않아서, 코드를 이런식으로 고치고 난 후에 실행했는데 로그아웃으로 네비게이터가 authStack에 관련된 화면을 다시 보여주고 난 후에 이후 로그인까지는 의도적으로 되지만 로그인을 다시 실행하면 이전에 스토리지가 다 지워지지 않았는지 계정을 바꿔서 로그인 할 경우 전에 있던 계정으로 로그인이 되는 현상이 발생하고 있습니다. 분명 헤더와 스토리지를 지움으로서 accessToken과 refreshToken 둘 다 지운걸로 생각했는데 이런 일이 생기는 이유가 궁금합니다. 로그아웃 엔드포인트 호출까지 진행되고 다시 화면이 랜더링 되어서 저는 괜찮았다고 생각했는데 이후 storage가 다 지워지지 않는 것이 원인인것 같습니다
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. 강사님 안녕하세요. 지금 mac m3환경에서 개발중입니다. react-native 버젼 : 0.72.6 현재 [2-5] Drawer Navigation을 수강중인데요, 아이폰은 빌드 성공했는데 안드로이드에서 계속 빌드가 실패하고 있습니다. gpt에게 한번 질문을 해보니 버전을 올리라고하더라구요. 그럼 기존에 맞춰놓은 것들이 깨질까봐 걱정되어서 질문드립니다. 어떻게 하면좋을까요? 터미널: info 💡 Tip: Make sure that you have set up your development environment correctly, by running react-native doctor. To read more about doctor command visit: https://github.com/react-native-community/cli/blob/main/packages/cli-doctor/README.md#doctor /Users/rengoku/Documents/projects/Matzip/front/node_modules/react-native-reanimated/android/src/main/java/com/swmansion/reanimated/NodesManager.java:440: error: switch rules are not supported in -source 11 case "opacity" -> { ^ (use -source 14 or higher to enable switch rules) /Users/rengoku/Documents/projects/Matzip/front/node_modules/react-native-reanimated/android/src/main/java/com/swmansion/reanimated/layoutReanimation/AnimationsManager.java:356: error: pattern matching in instanceof is not supported in -source 11 if (props.get(Snapshot.TRANSFORM_MATRIX) instanceof ReadableNativeArray matrixArray) { ^ (use -source 16 or higher to enable pattern matching in instanceof) 2 errors FAILURE: Build failed with an exception. * What went wrong: Execution failed for task ':react-native-reanimated:compileDebugJavaWithJavac'. > Compilation failed; see the compiler error output for details. * 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 BUILD FAILED in 3s info Run CLI with --verbose flag for more details. 버전 정보입니다. "dependencies": { "@react-native-masked-view/masked-view": "^0.3.2", "@react-navigation/drawer": "^7.0.5", "@react-navigation/native": "^7.0.3", "@react-navigation/stack": "^7.0.3", "react": "18.2.0", "react-native": "0.72.6", "react-native-gesture-handler": "^2.21.2", "react-native-reanimated": "^3.16.1", "react-native-safe-area-context": "^4.14.0", "react-native-screens": "^4.1.0" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/eslint-config": "^0.72.2", "@react-native/metro-config": "^0.72.11", "@tsconfig/react-native": "^3.0.0", "@types/react": "^18.0.24", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.2.1", "eslint": "^8.19.0", "jest": "^29.2.1", "metro-react-native-babel-preset": "0.76.8", "prettier": "^2.4.1", "react-test-renderer": "18.2.0", "typescript": "4.8.4" }, "engines": { "node": ">=16" }
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. 이거 무슨 오류일까요ㅜㅜ
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
database 연결 정보는 본인 정보로 작성...!! @Module({ imports: [ TypeOrmModule.forRoot({ username: 'root', password: '1234', database: 'matzip-server', }), ], controllers: [AppController], providers: [AppService], })
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. 서버도 켰고 코드에 문제도 없어보이는데 회원가입해도 DB에 아무런 값이 안들어가네요 네트워크에러 어떻게 해결해야하나요..
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. axios.ts에서 BaseURL 바꿔도 로그인이 안됩니다...
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
❗ 질문 작성시 꼭 참고해주세요 현재 문제(또는 에러)와 코드(또는 github) 를 첨부해주세요. 맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경 을 함께 적어주시면 도움이 됩니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. ( 일부만 자르거나 복사하지말아주세요 .) 개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다. 아래 두가지 오류가 계속 반복됩니다. 윈도우입니다. 그리고 영상에서 로그인을 하고 지도를 보는데 로그인 아이디 비번은 그냥 아무거나 하면 되나용?
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
안녕하세요 문득 궁금해서 질문드립니다. 리액트쿼리 공식문서를보면 const { isPending, error, data } = useQuery({ queryKey: ['repoData'], queryFn: () => fetch('https://api.github.com/repos/TanStack/query').then((res) => res.json(), ), }) if (isPending) return 'Loading...' if (error) return 'An error has occurred: ' + error.message 이렇게 항상 값이 있다는 가정하에 데이터를 사용하게 하는데 MapHomeScreen이나 MapLegend 등에선 const {categories} = getProfileQuery.data || {}; 이런식으로 하시더라구요 실제로 저는 MapHomeScreen 스크린에서 마커가 클릭후에 나타나는 현상이 있어서 const {data: markers = [], isPending, error} = useGetMarkers(); if (isPending || error) return <></>; 이렇게 데이터가 로딩또는 에러가 아닐때 다음 구문으로 넘어가게 하니 마커가 잘 나타났습니다 제가 궁금한건 if (isPending || error) return <></>; 처리를 해줄때와 안해줘도 될 때가 따로 있는것인지 그게 궁금합니다~
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
개발환경 윈도우 안드로이드 ReactNative 버전 react-native-cli : 2.0.1 react-native : 0.76.1 Node 버전 : v22.11.0
해결됨
맛집 지도앱 만들기 (React Native & NestJS)
function useLogout(mutationOptions?: UseMutationCustomOptions) { return useMutation({ mutationFn: logout, onSuccess: () => { console.log("before storage empty: ", getEncryptStorage(storageKeys.ACCESS_TOKEN)); removeHeader('Authorization'); removeEncryptStorage(storageKeys.REFRESH_TOKEN); queryClient.resetQueries({queryKey: [queryKeys.AUTH]}); console.log("storage empty: ", getEncryptStorage(storageKeys.ACCESS_TOKEN)); }, ...mutationOptions, }); } 이게 강사님께서 쓰신 로그아웃 코드인데 removeEncryptStorage를 비동기 함수로 구현하셨었습니다. 제가 로그아웃 버튼을 누르는데 'localhost:제가 만든 서버 포트':auth/logout 이런식으로 클라이언트에 요청했을 때 로그를 살펴보니깐 LOG Access token after remove: {"_h": 0, "_i": 0, "_j": null, "_k": null} LOG Access token removed: false LOG isLogIn: false //이건 Navigation/root/RootNavigator.tsx에 isLogin값이 false인지 true인지 확인하기 위해 콘솔로그 찍음 이런식으로 출력되었었습니다. 로그아웃 직후에 바로 로그인이 된 상태로 작동했습니다. removeEncryptStorage는 비동기 함수이기 때문에 await 없이 호출되면 로그아웃 관련된 비동기 작업이 완려되기 전에 onSuccess내의 코드들이 실행된거 같습니다. function useLogout(mutationOptions?: UseMutationCustomOptions) { return useMutation({ mutationFn: async () => { removeHeader('Authorization'); await removeEncryptStorage(storageKeys.REFRESH_TOKEN); }, onSettled: () => { // 관련 쿼리 무효화하여 캐시 초기화 queryClient.invalidateQueries({queryKey: [queryKeys.AUTH]}); }, ...mutationOptions }); } 그래서 이런식으로 await async로 토큰 제거 작업이 완료된 후 까지 기다리게 만들어서 하니깐 로그아웃이 잘 작동되고 서버 내에 db랑 연결된 users 테이블 내의 refresh_token도 사라진걸 확인할 수 있었습니다. 제가 혹시 놓친 부분이 있었는지 왜 이런 차이가 나는지 정확한 이유를 몰라서 질문 남깁니다.
