React Native/General24 [React Native] __DEV__ 개발 모드 활성화 개발 모드와 실제 서버와 구분해서 테스트해야할 때가 종종 있습니다. 저의 경우, 개발 모드에서 애드몹의 실제 광고 ID를 갖고 테스트하면 광고계정이 삭제되기때문에 테스트용 ID를 넣어줘야 하는데요. 개발할때 바꾸고, 출시용으로 번들 압축할 때 바꾸고하는게 여간 귀찮은 일이 아니었습니다. React Native에는 기본적으로 __DEV__ 를 입력하면 개발 모드를 true, false값으로 반환해줍니다. 따로 라이브러리를 import하거나 선언할 필요 없이 사용하고 싶은 곳에 __DEV__ 를 입력해주면 돼요. 개발 모드는 안드로이드&iOS 시뮬레이터, usb 연결한 실제 기기일때 true값을 반환해줍니다. 그리고 앱 번들로 제출한 배포버전에서는 false로 됩니다. 간단한 예시로 아래 코드처럼 테스트해보.. 2022. 1. 10. [React Native] Facebook SDK 공식 라이브러리 업데이트 중단 안녕하세요. facebook에서 공식으로 지원하고 있던 RN 라이브러리가 더이상 업데이트 되지 않습니다. 아래 링크의 readme를 읽어보면 업데이트 중단된 것을 알 수 있고, 가장 최근 release가 2020년 11월 24일입니다. https://github.com/facebookarchive/react-native-fbsdk GitHub - facebookarchive/react-native-fbsdk: A React Native wrapper around the Facebook SDKs for Android and iOS. Provides acce A React Native wrapper around the Facebook SDKs for Android and iOS. Provides access.. 2022. 1. 9. [React Native] firebase auth 연동해서 구글 로그인하는 방법 RN으로 만든 영단어 앱테크 어플 (출시 후 매일 100명씩 가입 중) 아이폰> 캐시보카 - 돈버는 영단어 앱테크 단어를 맞추면 1캐시가 적립돼요. 적립된 캐시는 네이버 포인트로 전환할 수 있어요. apps.apple.com RN로 만든 주식, 코인 물타기 계산기, 수익률 계산기 앱 안드로이드> 아이폰> 안녕하세요. 이번 게시글에서는 파이어베이스를 이용해서 구글로 회원가입 및 로그인을 하는 방법을 알아보겠습니다. 저도 처음에는 너무너무 복잡해보였는데, 쉽습니다! 10분만에 끝나버렸어요 ㅎㅎ 참고로 이번 게시글은 android, ios앱과 파이어베이스를 연동을 모두 마친 상태에서 설명이 진행됩니다. 앱과 firebase프로젝트를 연동하는 사전작업에 대해서는 따로 설명하지 않고 구글 로그인 부분만 설명드.. 2022. 1. 8. [React Native] useEffect에서 async 사용하는 방법 1. 잘못된 사용 useEffect 안에서 async를 직접 선언해줌. 2. 올바른 사용 async - await을 써야하는 부분을 별도의 함수로 만들어주고, useEffect에서 호출함. 2022. 1. 7. [React Native] MobX 도입 10분 컷! 1. mobx 도입 배경 안녕하세요. 제가 개발중인 영단어 앱은 하나의 파일 안에서 'screenMode' 상태값에 따라 화면을 바꿔주고 있습니다. screenMode === 'selectVoca'일 때는 왼쪽 화면이, === 'quiz'일 때는 오른쪽 화면으로 변경됩니다. 지금까지는 한 파일 안에서만 바뀌니 useState를 사용해왔었는데요. 개발을 하다보니 이 파일, 저 파일에서도 screenMode를 참조해야할 일이 생겨버렸습니다..! 처음에는 props로 넘겨주고, 또 넘겨주고 했는데... 너무 복잡해서 ㅠ mobX를 도입하기로 결정했습니다. 2. React Native에 mobx를 적용하는 방법 및 과정 * 저는 함수형 코드를 사용하기 때문에 클래스형 코드로 개발하시는 분들과는 많이 다를 수 있.. 2022. 1. 7. [React Native] 스타일(색상)을 중앙에서 관리하는 방법 바로보카와 엣세이 앱에는 8개의 파랑 계열 그레이 컬러가 사용됩니다. 임의대로 Gray50 ~ Gray900 라고 정했습니다. 이렇게 정해놓으면 gray50은 배경에, 100은 구분선, 200은 버튼의 테두리 등 농도(?)에 따라서 통일성있게 사용하기에 편합니다. 그런데 개발을 하다보면 컬러 헥사값(#000000등)이나 RGB값을 외우가기 어렵죠. 처음에는 아래처럼 모든 스타일에 직접 정의를 해줬는데요. 이것도 반복되면 손이 은근 많이 탑니다. 그래서 중앙에 색상코드를 정의하고 import하는 방법으로 이용해보기로 했습니다. 이렇게 바꾼지 1주일이 넘었는데, 훨씬 편합니다 ㅎㅎ 색상코드를 외우지 않아도 되고, 외웠더라도 따옴표누르고 직접 안쳐도 되니 좋아요! 중앙에서 쓰는 법은 아주 간단해요.. lib디.. 2022. 1. 6. 이전 1 2 3 4 다음
