React-Native-CheatSheet
1.[RN-CheatSheet] 프로젝트 클리닝
npx react-native-clean-project
2.[RN-CheatSheet] Wireless debugging (무선, 원격 디버깅)
선 없는 쾌적한 개발환경, 모바일 개발환경에서 Wireless(wifi) debugging 설정하고 선으로부터 자유로워지자...
3.[RN-CheatSheet] FlatList EmptyComponent 가운데 정렬하기
FlatList 의 ListEmptyComponent 프롭을 통해서 data 가 비어있을때, 렌더링될 컴포넌트를 전달할 수 있다.일반적으로 아무 스타일 없이 넘기게 될 경우 다음과 같이 나오게 된다.보통 가운데 정렬을 하기 위해서, contentContainerStyl
4.[RN-CheatSheet] Autolinking guide
https://github.com/react-native-community/cli/blob/master/docs/autolinking.md
5.[RN-CheatSheet] Native module refresh
앱을 Reload 하는 경우에는 JS컨텍스트가 초기화 된다.하지만 Native 객체들은 초기화 되지 않아서, 새로운 fresh 한 상태로 만들기 위해서는직접 수동으로 초기화 해주는 인터페이스를 구현해줘야 한다.React-Native 내부에서 NativeModule.in
6.[RN-CheatSheet] Flipper 실제 기기 연결하기
실제 기기를 연결하기 위해서, 기본적인 설정 이외에도 Flipper 에서 몇가지 추가 설정이 필요하다.Flipper 의 Settings 에 들어가면 Android SDK 경로와 iOS IDB binary 경로가 필요하다.보통 Android SDK 는 RN 환경을 설정하
7.[RN-CheatSheet] Android adb 여러 디바이스 연결 설정
안드로이드 디바이스를 여러대 연결하는 경우, 아래와 같은 adb 명령어 입력시 에러가 발생한다.adb reverse tcp:8081 tcp:8081 -> adb: error: more than one device/emulator이럴때는 특정 디바이스를 선택해서 명령어를
8.[RN-CheatSheet] React-Native M1 디바이스 환경설정
M1 이 나온지 얼마 안됐을때는 호환되는 프로그램들이 많지 않아서 Intel 맥용으로 빌드된 프로그램을 Rosetta2 라는 프로그램을 사용해서 실행해야 했다.흔히 보이는 CLI 환경에서 명령어를 실행할때 붙이는 arch -x86_64 some-program 이것인데엄
9.[RN-CheatSheet] Unhandled promise rejection 트래킹하기
React-Native 에서 개열받는 Unhandled promise rejection 워닝 제거하거나 핸들링 하는 방법
10.[RN-CheatSheet] 0.71 살펴보기
React-Native 0.71 버전이 릴리즈 됐습니다. 어떤 변경사항들이 있었는지 함께 살펴봅시다.
11.[RN-CheatSheet] Watchman error
watchman 은 페이스북에서 만든, nodemon 이나 chokidar 처럼 파일단에서 변경사항이 발생했을 때 어떠한 작업을 하기 위한 용도의 프로그램이다. RN에서는 이를 사용해서, 작업 파일에 변경사항이 생겼을때 번들링을 다시 하거나 refresh 를 하는데
12.[RN-CheatSheet] Android module, maven url injection
안드로이드용 Native 브릿지 모듈을 개발하다 보면 dependencies 에 추가된 라이브러리 설치를 위해서가끔씩 custom maven repository 를 추가해줘야 할 일이 있다.KakaoAD SDK 의 경우 아래와 같은식으로 카카오의 maven url 을
13.[RN-CheatSheet] 시뮬레이터(에뮬레이터) 관리
Expo 에서 새롭게 Orbit 이라는 툴을 선보였다.메뉴바에서 시뮬레이터 및 빌드들을 선택하고 바로 실행할 수 있게끔 도와주는 도구인데, 아직 실험 단계이다. (mac만 지원)일차적으론 Expo 계정을 연결하고, Snack 및 EAS 등의 빌드를 바로 시뮬레이터에 띄
14.[RN-CheatSheet] React-Native setup in M1 device
When the M1 chip was first released, there were limited compatible programs available, so users had to use a program called Rosetta 2 to run Intel-bas
15.[RN Cheat-Sheet] 0.72 살펴보기
React-Native 0.72 버전이 릴리즈 됐습니다 👏 (CHANGELOG) 모든 내용을 살펴보기 보다는, 사용하는 입장에서 영향이 있을법한 것들을 살펴봅시다. >### 꿀팁 특정 PR 이 어떤 버전에 릴리즈 되었나를 보기 위해서는 아래와 같이, 머지 코멘트의
16.[RN Cheat-Sheet] 0.73 살펴보기
React-Native 0.73 버전이 릴리즈 됐습니다 👏 (CHANGELOG(https://github.com/facebook/react-native/blob/main/CHANGELOG.md모든 내용을 살펴보기 보다는, 사용하는 입장에서 영향이 있을법한 것
17.[RN-CheatSheet] push notification 완벽 이해하기
mobile(react-native) 에서 push notification 이 어떻게 동작하는지 개념을 이해해보자. 푸시를 구현하다보면 많은 라이브러리들을 만난다. https://github.com/react-native-push-notification/ios https://github.com/zo0r/react-native-push-notificati...
18.[RN CheatSheet] 0.74 살펴보기
React-Native 0.74 버전이 릴리즈 됐습니다 👏 (CHANGELOG(https://github.com/facebook/react-native/blob/main/CHANGELOG.md모든 내용을 살펴보기 보다는, 사용하는 입장에서 영향이 있을법한 것
19.[RN CheatSheet] Fetch Text Streaming 사용하기
React-Native 에서 ChatGPT 와 같은 자연스러운 UX 를 구현하기 위해, text streaming 을 이용하는 방법을 알아보자.
20.[RN CheatSheet] 0.75 살펴보기
React-Native 0.75 버전이 릴리즈 됐습니다 👏 살펴봅시다!
21.[RN-CheatSheet] Android Edge-to-Edge Layout
Target sdk 35(Android 15) 부터 iOS 와 동일하게 Status bar, Navigation bar 영역까지 화면을 확장시킬 수 있게 됩니다.beforeafteriOS 의 경우 iPhone X 에서 이 레이아웃이 처음으로 도입되었을때 "대" 혼란이
22.[RN CheatSheet] New architecture 비활성화 하기
0.76+ 부터 New architecture 가 기본으로 활성화된 상태로 배포되게 됩니다.주요한 커뮤니티 라이브러리들은 준비가 되어있지만, 나머지 커뮤니티 라이브러리들은 활발하게 유지가 되지 않으므로 앞으로 몇달간은 이 전환이 원활하지 않을 수 있습니다.때문에 기본으
23.[RN Cheat-Sheet] 0.76 살펴보기
React-Native 0.76 버전이 릴리즈 됐습니다 👏 (CHANGELOG) 드디어 결단을 내린것인지, 이번 업데이트부터 New architecture 가 활성화 된 상태로 프로젝트가 생성됩니다 🥲 이제부터 본격적으로 전체 생태계가 점진적으로 마이그레이션!!
24.[RN Cheat-Sheet] Interop Layer
React-Native 에서는 2018년부터 Old architecture 에서 New architecture 로 넘어가는 대규모 업데이트를 진행해왔고, 최근 릴리즈에서 이를 드디어 옵트아웃(기본 활성화) 으로 만들었습니다. New Architecture 는 대표적으