Dahee's Solution Hub

react native에서 apollo client를 이용한다. 클릭 이벤트가 발생할 때마다 특정 mutation을 호출하는데,이 mutation이 호출될 때마다 재렌더링이 2번 되는 것을 발견했다. 바로 이 mutation이다.62 line에서 return값 배열의 두번째 원소에는 loading, data 등이 들어가는데,mutation을 호출하면 이 loading과 data값이 업데이트되면서 총 2번의 렌더링이 더 진행되는 것이다. 그래서 결과값은 필요없다고 알려주고 재렌더링을 방지하는 옵션이 있지 않을까? 해서 찾아봤는데,역시나 있었다.https://www.apollographql.com/docs/react/data/mutations/#ignoreresults Mutations in Apollo C..

import { getStatusBarHeight } from 'react-native-status-bar-height'; const statusBarHeight = getStatusBarHeight(false); // skip android = false; const deviceHeight = Dimensions.get('screen').height; const windowHeight = Dimensions.get('window').height; deviceHeight: 기기 전체 세로길이 windowHeight: 앱이 차지하는 만큼의 세로길이 statusBarHeight는 상태바의 세로길이 공식문서 링크: https://reactnative.dev/docs/dimensions 문제는 windowHei..

https://github.com/zo0r/react-native-push-notification GitHub - zo0r/react-native-push-notification: React Native Local and Remote NotificationsReact Native Local and Remote Notifications. Contribute to zo0r/react-native-push-notification development by creating an account on GitHub.github.com이 라이브러리를 사용할 때 주의점이 있다.보다시피 id를 설정할 수 있는데, 한번 지정된 id는 다시 사용하지 않는 것이 좋다.안그러면 이 푸시에 넣은 데이터를 꺼내올 때 예전 id의 데..

어느날... 이러한 CS가 왔다.광고를 다 봤는데도 상태바에 가려져서 X버튼을 누르지 못했다는 것!현재 react native에서 보상형 영상 광고를 띄워주기 위해@react-native-firebase/admob: 11.5.0을 사용하고 있다. 서드파티... admob을 원망하며 admob+statusbar를 키워드로 이슈를 찾아봤는데 마땅히 해결책이 없었다.-> 그런데 상태바를 가리는거면.. 상태바를 없애면 되는 문제 아닌가? 싶었다. 당장 react-native에서  StatusBar를 이용해 숨겨보았다.상태바 부분을 터치범위로 두고, 상태바가 있을 때와 없을 때 각각 터치가 가능한 지 실험해보았다.예상한대로, 상태바가 있을 때는 클릭이 가능했고 없을 때는 불가능했다. 위 영상에서 사용한 코드를 첨..

[React Native] linkTo 사용 시, The 'navigation' object hasn't been initialized yet 문제 해결 방법 (react-navigation NavigationContainer 마운팅된 직후를 onReady로 감지하기)특정 페이지에 도달 할 수 있는 링크인 딥링크를 이용하고 있다. 앱이 완전히 닫힌 상태에서 딥링크로 앱을 열면,(Android의 경우) Linking.getInitialURL 로 (iOS의 경우) Linking.addEventListener('url', handleOpenUrl) 로앱을 열게 한 url 장본인(?)을 알 수 있다.(이 글은 Android 기준으로 코드를 작성했습니다.) const url = "roubitapp://root-t..

채팅화면을 구성하는 2가지 방법에 대해 알아봅시다!(FlatList의 inverted, onContentSizeChange) 1. FlatList의 inverted prop 사용const data = [ "안녕하세요! 채팅을 입력해주세요", "안녕", "반갑습니다!", "나는 보라야",] inverted prop을 사용하면data는 위가 아닌 아래부터 배치가 됩니다. (좌)이 상태라면, data가 추가될 때마다 위에 쌓이게 됩니다.따라서 data.reverse()를 통해 data의 순서를 역으로 세팅해줍니다. (우) 아주 간단하죠! 그런데 data의 첫원소인 "안녕하세요! 채팅을 입력해주세요"가 빨간박스의 좌상단이 아닌, 파란박스의 좌상단부터 배치되게 할 수는 없을까요? 그렇다면 inverted는 포..

메세지 큐 시스템: SQS,Worker,Cron,Queue API Server목표- 대량의 푸시를 Main Server 영향 가지 않도록 [정해진 시간에,  따로, 안전하게] 보내기: 유저 경험 최적화🔥: DB 부하 줄여 비용 절감🔥 현재 문제 상황: Main Server에서 [DB에게 무리한 데이터를 요청]하고 [무거운 로직을 메인서버에서 돌려] 사용자에게 푸시를 보내는 과정에서 부하가 발생하여, [비용이 들고] [유저 경험을 안좋게] 만든다. 문제점: [DB에게 무리한 데이터를 요청]해결법: DB에게는 최대한 심플하게 데이터 요청where절에 많은 요청 금지. 최대한 select만 해서 데이터 가져오고, 나머지 데이터 필터링은 (DB보다 값싼) 인스턴스 안에서 하자. 문제점: [무거운 로직을 메인..

Debounce 도입 배경 아래 화면은 루빗 앱에서 진행되는 회원가입의 최종 화면이다. - "이대로 시작할래" 버튼을 누를 때 회원가입 API 호출이 일어난다. - API 호출 결과, DB에 User가 하나 생성된다. - 이 때 "이대로 시작할래" 버튼을 여러번 누른다면? User가 여러개 생성된다. - 그렇다면 User가 여러개 생성되는 것을 방지해야한다. - 방지하기 위해 버튼을 누르는 순간 loading state를 true로 만들어 해당 버튼을 비활성화 시킨다. 위 조건을 코드로 구현하면 아래와 같다. const [totalSignupLoading, setTotalSignupLoading] = useState(false); /** 회원가입 */ const signup = () => { setTot..

구글 플레이스토어 구독상품을 유저가 구독하면 GPA.1111-1111-1111-11111 이런식으로 주문 ID가 생긴다. 22.02.15에 처음 구독하고 그 다음에는 갱신을 한다고 해보자. 그러면 주문ID는 매번 새롭게 생성될까? 아니다. 자세히 살펴보니 일련의 규칙이 있었다. 위 케이스를 보면, 동일한 주문ID 뒤에 붙는 숫자만 1씩 늘어나는 것을 볼 수 있다. 사진에는 나와있지 않지만, 최초 구독은 GPA.1111-1111-1111-11111 만 붙고, 1회차 갱신은 GPA.1111-1111-1111-11111..0 이 된다. 따라서, GPA.1111-1111-1111-11111..10 을 해석하면 이건 11회차 갱신이 되는 것이다! 총 12번을 결제한 유저인 것이다. (고마운 유저분이다!) 이렇게 ..

이미 깃헙에 ssh 올려져 있는데도, 로컬 터미널에서는 git push 시 암호 입력해야하는 경우가 있다. 그런 경우에는, 로컬 ssh-agent에 암호가 등록되어있지 않은 경우다.ssh-agent: SSH 키를 관리하고 키를 사용할 때마다 암호를 입력하지 않도록 도와주는 프로그램. eval "$(ssh-agent -s)"ssh-add ~/.ssh/id_rsa이렇게 하면 등록 완료! 이제 로컬에서 git push 마다 암호를 입력하지 않아도 된다.