안녕하세요해당수업중 강의 내용대로 했는데 실행시 아래와 같이 에러 뜨고 정상 실행이 안됩니다. TypeError: react_dom_1.default.findDOMNode is not a functionat ReactQuill.getEditingArea (http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16760:43)at ReactQuill.instantiateEditor (http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16631:50)at ReactQuill.componentDidMount (http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16590:14)at LoadableComponent (http://localhost:3000/_next/static/chunks/_2df4111c._.js:296:57)at WebEditorPage (http://localhost:3000/_next/static/chunks/_2df4111c._.js:81:215)at ClientPageRoot (http://localhost:3000/_next/static/chunks/node_modules_next_dist_1a6ee436._.js:2053:50) 

(너무 초보적인 질문이라면 죄송합니다 ㅠ.. 리액트 초보여서,,) 제가 알기로는 리액트에서는 컴포넌트 리렌더링 시점이 컴포넌트 함수를 직접 재호출하거나, 내부 state가 변경됐을 때로 알고 있는데요, 그런 개념을 가지고 코드를 살펴보면 RootNavigator에서 로그인 여부에 따라 분기처리를 하고 있는데, 여기서 내부 state를 가지고 있는 것도 아닌데, useAuth의 로그인이나 로그아웃 메서드 호출만으로 리렌더링이 되어서 스크린이 변경되고 있는데 어떻게 이 동작이 가능한건지가 궁금합니다.리렌더링을 발생시키는 조건이 궁금합니다.

안녕하세요!useGetRefreshToken 에서 응답 성공/실패 시에 각각 useEffect로 감싸서 후속처리를 하게 작성해주셨는데요, 해당 로직들은 항상 해당 함수가 호출되고 나서 응답이 온 후에 순차적으로 실행되어야 하는 로직으로 생각이 들어서 비동기로 동작하는 useEffect를 굳이 사용할 필요가 없다고 생각이 드는데요, useEffect로 사용하신 특별한 이유가 있으실까요!?

저를 포함한 많은 수강생분들께서 설치시 Gem 과 rn 버전등 강의와 latest 버전의 충돌로 인해 많은 어려움을 겪고 계신 것 같아 2025년 5월 기준 제가 해결한 방법을 공유드리려고 올려둡니다! React Native 공식 문서는 최신이 아닌 0.73 버전으로 확인합니다 => 0.73 버전 안내 링크프로젝트 생성시에는 @latest 가 아닌  0.73 버전으로 설치를 합니다npx react-native@0.73 init 사용하실프로젝트명 --version 0.73설치되어 있는데도 CLT가 기본 설정이면, Xcode 경로로 전환해줘야 합니다터미널에서 xcode-select -p 를 입력해서 경로를 확인합니다. 만일 결과가/Library/Developer/CommandLineTools이렇게 되어있다면 오류가 나는 원인 중 하나입니다! 이 경우 아래 3-b 순서를 통해 변경해줘야 합니다터미널에서 sudo xcode-select -s /Applications/Xcode.app/Contents/Developer를 입력해 경로를 변경해줍니다터미널에서 xcode-select -p를 입력해 /Applications/Xcode.app/Contents/Developer 와 같이 경로가 변경되었는지 확인해줍니다여기까지 한 후에도 npm start 가 오류가 발생하면cd ios rm -rf Pods Podfile.lock pod install cd .. 이를 통해서 cocoapod 관련 찌꺼기를 없애고, bundle install 를 해서 필요한 gem 들을 다시 .install 해줍니다. 이렇게 한 후 npm start 를 하여 오류를 수정했었습니다! IOS 는 또 어떤 요류로 잘 안 될 수 있는지 모르니 .. 그냥 최신 버전으로 하고 강의 내용을 최신 버전에 맞추는게 현명할지도..

선생님께서는 로그인직후 내 정보불러오기위해서 fetchQuery를쓰셨는데 invalidateQueries 를 써도 되는거아닌가? 무슨차이때문에 그런걸까?를 생각해봤는데 fetchQuery는 즉시 가져오는거기때문에 이후 /이나 뭐 어디다른페이지를가도 로딩이안뜨고 바로 최신상태를 유지하는 반면 invalidateQueries 를 사용하면 기존 쿼리를 scale로 처리해줘서 캐싱무효화를해주고 그 해당 query key를 사용중인 페이지에 들어가면 그때 서버로부터 리페치를 한다? 그렇기때문에 로딩이뜬다. 그래서 여기선 fetchQuery를 사용하신거다로 이해했는데 맞을까요?

import { Link, Stack } from 'expo-router'; import Foundation from '@expo/vector-icons/Foundation'; import { colors } from '@/constants'; export default function AuthLayout() { return ( <Stack screenOptions={{ headerTintColor: colors.BLACK, contentStyle: { backgroundColor: colors.WHITE, }, }} > <Stack.Screen name="index" options={{ title: '로그인', headerTitleAlign: 'center', headerShown: true, headerLeft: () => ( <Link href={'/'} replace> <Foundation name="home" size={28} color={'black'} /> </Link> ), }} /> </Stack> ); } 선생님은 Link 태그에 paddingLeft해서 안드로이드 Header에서 조정해주신반면 저는 좀 더 통일성을위해서 headerTitleAlign 을 center로 줬습니다.이 방법이 더 괜찮아보이는데 어떤지 궁금해요!

안녕하세요!React Native도 Next.js와 같이 폴더 기반 라우트라 게시글 수정 페이지를 ~/app/post/update/[id].tsx에 만들었고,해당 [id] 부분에 동적으로 게시글 id 값을 넣어 라우팅할 수 있게 하였습니다.또 ~/app/post/_layout.tsx 레이아웃에 Stack.Screen에 등록도 하였구요! 그래서 엑스포 라우터를 import 하여import { router } from 'expo-router'; 바텀 시트의 수정 버튼 클릭 시, 다음을 호출하였는데요,router.push(`/post/update/${post.id}`); 다음 에러가 납니다... ㅠ Argument of type /post/update/${number} is not assignable to parameter of type 'RelativePathString | ExternalPathString | ... '/post/update/[id]'라는 경로는 인식하는 것으로 보아 엑스포 라우터가 다이나믹 경로를 못 찾는 것 같은데 왜 이런 현상이 발생하는지 모르겠습니다 ㅠ

expo 가 업데이트 되면서 오류가 발생한거 같은데 아무리 찾아봐도 해결을 못하겠어서 질문드립니다ㅠ 오류는 LOG [Error: Component auth has not been registered yet] LOG [FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call initializeApp() first (app/no-app).]깃주소는https://github.com/dvrakry/rn-photo2입니다 감사합니다!

class MainActivity:ReactActivity(){// ...overridefunonCreate(savedInstanceState: Bundle?){super.onCreate(null)}// ...}공식문서와 강의에는 위의 코드로 진행해주셨는데수업노트에overridefunonCreate(savedInstanceState: Bundle?) { if (savedInstanceState == null) { SplashScreen.show(this) } super.onCreate(savedInstanceState) }이렇게 코드가 적혀있어서 문의드립니다. 수업노트 부분의 코드가 맞는 것이지요?

안녕하세요!! 강의 너무나도 잘 듣고 있습니다. 18-05 게시글 이미지와 함께 등록 23:25분에서 file에 대한 타입을 지정을 할 때 알려주신 방법 외에도 ! 를 이용해서 해결을 의도치 않게 했는데,구글 및 스택오버플로우에도 Argument of type ' file | undefined' is not assignable to parameter of type 'File'. Type 'undefined' is not assignable to type 'File'.ts(2345)해당 오류를 검색해보았지만 알려주신 방법들 외에는 느낌표를 사용하는 방법은 찾지 못했습니다.이게 왜 되는건지... 도통 알수가 없네요... 이건 어떤 원리인가요??항상 감사드립니다.

console.log 를 해도 vscode 터미널상에서 로그가 뜨지 않는데,찾아보니 최신 ReactNative버전에선 React Native DevTools를 사용하라는 말이 있더라구요. 혹시 React Native DevTools에서 console.log를 확인하는 방법이 있을까요? 단순히 j눌러서 열고 "회원가입하기" 버튼 눌러도 로그가 안나오네요...ㅠㅠ      // package.json { "name": "community", "main": "expo-router/entry", "version": "1.0.0", "scripts": { "start": "expo start", "reset-project": "node ./scripts/reset-project.js", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web", "test": "jest --watchAll", "lint": "expo lint" }, "jest": { "preset": "jest-expo" }, "dependencies": { "@expo/vector-icons": "^14.0.2", "@react-navigation/bottom-tabs": "^7.2.0", "@react-navigation/native": "^7.0.14", "expo": "~52.0.37", "expo-blur": "~14.0.3", "expo-constants": "~17.0.7", "expo-font": "~13.0.4", "expo-haptics": "~14.0.1", "expo-linking": "~7.0.5", "expo-router": "~4.0.17", "expo-splash-screen": "~0.29.22", "expo-status-bar": "~2.0.1", "expo-symbols": "~0.2.2", "expo-system-ui": "~4.0.8", "expo-web-browser": "~14.0.2", "react": "18.3.1", "react-dom": "18.3.1", "react-native": "0.76.7", "react-native-gesture-handler": "~2.20.2", "react-native-reanimated": "~3.16.1", "react-native-safe-area-context": "4.12.0", "react-native-screens": "~4.4.0", "react-native-web": "~0.19.13", "react-native-webview": "13.12.5" }, "devDependencies": { "@babel/core": "^7.25.2", "@types/jest": "^29.5.12", "@types/react": "~18.3.12", "@types/react-test-renderer": "^18.3.0", "jest": "^29.2.1", "jest-expo": "~52.0.4", "react-test-renderer": "18.3.1", "typescript": "^5.3.3" }, "private": true }

안드로이드로 실행하고 있고 앱 아이콘까지 성공하였습니다. 그런데 app. tsx에function Section({children, title}: SectionProps): React.JSX.Element { useEffect(() => { setTimeout(() => { SplashScreen.hide(); }, 1000); }); const isDarkMode = useColorScheme() === 'dark';이 코드를 올리면 Cannot read property 'hide' of null 이라고 뜹니다. 그래서 시도해본 방법은-metro 서버 연겨리도 다시해보고-js hide 호출위치를 app()쪽에도 해보고-mainActivity 코드에 SplashScreen.show(this);코드가 잘 있는지 확인도 하고-gradle.properties에 android.enableJetifier=true추가해보고-androidmanifest의 activity에 android:theme="@style/SplashTheme"이 부분도 추가해보고-styles.xml에resource부분에 <!-- ① 스플래시 화면용 테마 --> <style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- launch_screen.xml(layout) 을 배경으로 사용 --> <item name="android:windowBackground">@layout/launch_screen</item> </style> <!-- ② 앱 전체용 기본 테마 --> <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar"> <!-- 여기에 앱 전체 스타일 아이템들을 넣으세요 --> <!-- 예: 상태바 색상, 기본 버튼 스타일 등 --> </style>이렇게도 넣어보아도 앱이 켜지려다가 바로 꺼져버립니다. 로그도 따로 안남고.. 혹시 이 부분에서 왜 이렇게 되고 해결방안이 있을까요??

2분 22초에서 return 문 앞에 const sunriseData = weatherData ? new Date(weatherData.sys.sunrise);이렇게 코드를 적었는데 이후의 코드에서는 갑자기 보이지 않아 이 코드는 어디가고이후의 return 앞에는 이 코드가 오게 되었는지 궁금합니다.const formatTime = timestamp => { const date = new Date((timestamp - 9 * 3600) * 1000); // UTC timestamp에 9시간 추가 return date.toLocaleTimeString([], {hour: '2-digit', minute: '2-digit'}); // 로컬 시간으로 포맷 }; 제가 이해할 때는 sunriseData가 wetherData의 unixtime을 현재 우리가 보는 시간으로 바꾸어 저장하는 것인데...아래의 formatTime은 sunriseData를 대체한 코드인가요?(시차도 적용한?)

npm_access_token 오류어떻게 해결하나요 ㅠㅠ

이전 버젼의 강의에서는 emotion을 쓰고본 강의에서는 tailwind를 쓰는데 저는 emotion이 가독성도 좋고 사용하기 편안하다는 느낌을 받았는데요새로 생긴 강의에서는 tailwind를 사용하는 이유가 뭘까요?

OAuth 클라이언트 ID를 생성하는데 "소유권을 확인할 수 없습니다. Android 패키지 이름과 디지털 지문이 이미 사용 중이므로 요청이 실패했습니다." 이런 메시지가 떠서 확인을 하는 데도 이유를 모르겠습니다. 오류를 고칠 수 있는 방법을 알려주세요

navigation.replace(MainRoutes.WRITE_TEXT, { photoUris });이 부분이 replace로 작동하지 않고 뒤로 가기시 navigate 와 같이다시 사진선택 화면으로 이동하는데 뭐가 문제인지 몰라서 질문드립니다. git주소는 =>https://github.com/dvrakry/rn-photo2입니다 감사합니다!

styled-components를 설치하고 import하면 다음과 같은 오류가 발생합니다:runtime not ready: ReferenceError: Property 'document' doesn't exist, js engine: hermes, stack: ...해결을 위해 시도한 것들은 다음과 같습니다:- import 부분에 /native 잘 붙어 있는지 확인- Metro 캐시 삭제 후 다시 실행- styled-components 버전을 낮춰 설치 (5.3.11 등)하지만 여전히 동일한 에러가 발생해서, 현재는 StyleSheet 방식으로 전환해서 사용하고 있습니다.혹시 이런 상황에서 styled-components를 안정적으로 사용하는 다른 방법이 있을까요? 아니면 React Native에서는 styled-components를 피하고 StyleSheet를 사용하는 게 나은 선택일까요?같은 경험을 하신 분이 있다면 공유해주시면 감사하겠습니다!

UpdateProfileScreen 에서 <Pressable onPress={() => navigation.navigate(MainRoutes.IMAGE_PICKER)} style={styles.imageButton} >...</Pressable>여기 클릭 후 ImagePicker.js로 이동시이 오류가 발생하는 상태인데요 getLocalUri는 onSubmit 누를때 사용하게 되는 상태가그전에 ImagePicker로 이동한후getPhotos함수에서 assets 를 가져올때 오류가 발생하는거 같은데...문제와 해결방법이 뭔지 궁금해서 질문드립니다!. 깃주소는 : https://github.com/dvrakry/rn-photo2입니다 감사합니다! 

안녕하세요. 15분 23초 부분 전에 화면이 잘린 것 같아 문의드려요.그 전의 부분에서는 이렇게 썼는데const OperatorButton = styled(NumberButton)` height: 8%; width: 13%; `;15분 23초 이후에 갑자기 이 부분이 const OperatorButton = styled.TouchableOpacity로 바껴져 있어요. ㅠㅠ 자동변환인가여? 이해가 안돼요