초보개발자의 소소한 기록

* Firebase 의 auth() 를 사용하여 인증을 요청할 때, email 과 password 값을 빈 값으로 호출 시 android 에서만 에러 발생 Given String is empty or null ... import auth from '@react-native-firebase/auth'; // 로그인 export function signIn({email, password}) { return auth().signInWithEmailAndPassword(email, password); } // 회원가입 export function signUp({email, password}) { return auth().createUserWithEmailAndPassword(email, password); } ..

@ List ** 9.3.4 Firestore에 포스트 등록하기 * 9.4 포스트 목록 조회하기 ** 9.4.1 PostCard 커포넌트 만들기 ** 9.4.2 Firestore로 포스트 목록 조회하기 ** 9.4.3 FeedScreen에서 getPost 호출 후 FlatList로 보여주기 ** 9.4.4 페이지네이션 및 시간순 정렬하기 @ Note 1. FeedScreen 외부에 renderItem 선언 - FlatList에서 보여지는 컴포넌트의 개수가 많을 경우, 컴토넌트 내부에서 renderItem을 렌더링할 때마다 매번 renderItem을 생성함 - 외부에 renderItem 을 한 번만 만들고 재사용하는 것이 성능 면에서 좋음 - 다른 방법으로 useMemo 사용 가능 2. Firesestor..

@ List * 9.1 탭 화면 구현하기 * 9.2 로그인 상태 유지하기 * 9.3 포스트 작성 기능 구현하기 ** 9.3.1 탭 중앙에 버튼 만들기 ** 9.3.2 업로드할 사진 선택 또는 카메라 촬영하기 ** 9.3.3 포스트 작성 화면 만들기 @ Note 1. 사용자 정보 인증 - 앱 종료 시에도 사용자의 로그인 상태를 유지하기 위해 일반적으로 AsyncStorage에 인증 정보를 저장하는 방법 사용함 - 하지만 Firebase로 인증을 구현했기 때문에, Firebase 의 auth().onAuthStateChanged 함수를 통해 인증 관련 작업 가능 2. 업로드할 사진 선택창 구현 - iOS 는 사용자에게 선택지를 줄 때 주로 ActionSheetIOS를 사용하여 UI 구현함 - android ..

* react-native-firebase/auth 패키지의 auth().onAuthStateChanged(callback) 메소드 호출 시 발생한 에러 분명 어제까지 잘되었던 기능이 갑자기 오늘부터 안되기 시작함. WARN Possible Unhandled Promise Rejection (id: 0): Error: [firestore/permission-denied] The caller does not have permission to execute the specified operation. NativeFirebaseError: [firestore/permission-denied] The caller does not have permission to execute the specified opera..

* package-lock.json 파일 삭제 후, package.json 을 최신 버전들로 재설치 (npm install) 후 실행 시 에러 발생 error: Error: Unable to resolve module html-parse-stringify2 from /Users/.../react-native/node_modules/react-i18next/dist/commonjs/Trans.js: html-parse-stringify2 could not be found within the project or in these directories: node_modules If you are sure the module exists, try these steps: 1. Clear watchman watche..

* toast 호출 후 navigation.navigate() 로 화면 이동 시 앱이 죽는 현상 발견 debug 모드로 error log 확인 시 _reactNative.Keyboard.removeListener 가 정상 동작 하지 않음을 확인 확인해보니 react-native v0.65 부터 removeListner() 메서드를 사용하지 않고, remove() 를 사용하는 것으로 변경됨 * reference : https://reactnative.dev/docs/0.65/keyboard#removelistener ToastContainer 에서 에러가 발생하고 있었기에 관련 package 버전을 확인해보니, 최신 버전에서 해당 이슈가 해결되어 있음을 확인 * reference : https://gith..

@ List * 8.5 이미지 업로드하기 ** 8.5.1 이미지 선택 기능 구현하기 ** 8.5.2 사용자 기본 이미지 설정하기 ** 8.5.3 Firebase Storage로 이미지 업로드하기 * 8.6 정리 @ Note 1. react-native-image-picker 라이브러리 $ yarn add react-native-image-picker $ npx pod-install - {launchCamera} : 사용할 이미지를 카메라로 바로 촬영할 때 사용 - {launchImageLibrary} : 사진첩에서 이미지 선택할 때 사용 > OS별 callback 로그 값 // iOS LOG {"assets": [{"fileName": "F25D0...539.jpg", "fileSize": 242106,..

* Firebase storage 에 이미지 업로드 요청 시 발생한 에러 WARN Possible Unhandled Promise Rejection (id: 26): Error: [storage/unauthorized] User is not authorized to perform the desired action. NativeFirebaseError: [storage/unauthorized] User is not authorized to perform the desired action. Firebase storage 의 권한 설정 관련 default 가 '모두 거부' 로 되어있다. 해당값을 read 권한은 모두 허용하고, write 권한은 인증된 사람만 업로드 할 수 있도록 권한을 새로 적용해주면 해결...

@ List * 8.3 Firebase에 회원 정보 등록하기 * 8.4 UserContext 만들고 로그인 사용자 분기 처리하기 @ Note 1. createContext API 의 사용 - reference : https://ko.reactjs.org/docs/context.html#reactcreatecontext 2. 로그인 관련 setUser를 호출 하는 시점 - 프로필이 등록된 계정으로 로그인했을 때 - Welcome 화면에서 프로필 정보를 등록했을 때 - 앱을 새로 켜서 로그인 상태가 유지됐을 때 3. user 상태에 따른 화면 분기 처리 - SignIn 및 Welcome 화면에서 MainTab 화면으로 전환 시, navigation 또는 push 로 하면 안됨 - 스택에 기존 로그인 또는 프..

* 비동기 작업을 처리하는 과정에서 발생한 에러 ERROR Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. " 언마운티드된 컴포넌트에 대해서는 상태를 업데이트 할 수 없다. 해당 작업은 수행되지 않지만 메모리 누수가 발생된다. 해결방법으로 useEffect 의 cleanup function을 이용해라. " ** 에러 발생 배경 ** 해당 에러 발생 ..