RN이 동작하는 원리를 알기 이전에 먼저 Thread 의 개념을 알아야한다. Thread란? 실행되는 프로세스 내에서 실제로 작업을 실행하는 주체로, 가장 작은 작업의 단위로 볼 수 있다. 명령어를 실행하여 처리하는 주체이다. 음식점에서, 여러가지 음식을 만드는 행위로 빗대어 말할 수 있다. (= 다양한 작업을 실행하는 주체) 보통 프로세스 하나 당 하나의 스레드를 가지고 있지만, 환경에 따라 두 개 이상의 스레드를 가질 수 있으며, 이를 멀티스레드 라고 한다. React Native 의 4가지 Thread React Native 에는 4가지 Thread가 있다. 1. Main Thread 또는 UI Thread Native 영역에 레이아웃을 그려주는 역할을 한다. 2. JavaScript Thread ..

목적 patch-package를 사용해 외부 라이브러리 수정하고 유지하기 개요 월간 캘린더가 아닌 주간 캘린더가 필요했는데, 리액트 네이티브 위클리 라이브러리 중 마땅한 캘린더가 없어 원하는 대로 커스텀하기 위해서는 라이브러리를 건드려야 하는 상황이 불가피했다. 라이브러리를 설치하고 node_modules 폴더에서 수정하자니, 일회성 빌드는 가능할지도 모르겠지만, 새로운 환경이나 모듈 재설치 때 마다 소스코드를 수정할 수 없는 노릇이다. 이처럼 개발하다보면 라이브러리를 건드려야 하는 상황이 생기게 된다. 이럴 때 해결할 수 있는 방법이 크게 두 개가 있다. library fork patch-package 1번의 경우, 라이브러리를 레포지토리를 내 깃헙으로 fork하고, 내 깃헙 라이브러리를 추가해주는 방..

1. Background 컴포넌트 지정 .... 2. 컴포넌트 props 전달 const renderBackground = useCallback( props => , [], ); 3. 컴포넌트 생성 및 스타일 지정 const BottomSheetBackground = ({style}: any) => { return ( ); };

Bottom Sheet 위 그림처럼, 아래에서 부터 위로 올라오는 일종의 보조 페이지를 Bottom Sheet 라고 한다. react-native-bottom-sheet 내가 사용한 Bottom Sheet 라이브러리이다. 최근까지도 업데이트가 이루어지고, 내가 원하는 형태의 UI라서 사용해야겠다고 생각했다. gothom Bottom Sheet 의 Document 사이트이다. 정리가 꽤 잘되어있는 것 같아 많아 참고했다. 설치 및 설정 방법 Getting Start 를 따라 따라하면 된다. 처음에는 적당히 설치 CLI만 보고 설치했다가, 실행이 안되어서;; 뭐가 문제인지 몰랐는데 제대로 읽지도 않고 설치했던 게 문제였다. 1. bottom sheet library 설치 $ yarn add @gorhom/b..

회사에서 리액트 네이티브로 프로젝트를 만드는데... 프로젝트 구조부터 만들어야 해서 버전 선택과 타입스크립트 사용 여부 등 모든 것을 처음부터 결정해야 했다. 우리 부서에서 구축된 개발 환경은 아래와 같다. (최신버전..) ✅ 우리부서 ✅ react : 18.0.0 react-native : 0.69.1 typescript 사용예정 O 다른 부서는 어떻게 하고있는지 궁금해서 다른 부서 선임 개발자분들의 자문을 구한 현재 개발 환경은 아래와 같았다. 사용 이유는 0.68 버전이 현재로서 그나마 안정적이고, 0.69 버전은 너무 최신이라 호환성와 안정성이 떨어져 선택하지 않으셨다고 한다. 👨🏻‍🏫 타부서 👨🏻‍🏫 react : 17.0.2 react-native : 0.68.2 typescript 사용 X ..

리액트 네이티브로 Adroid와 iOS 앱을 빠르게 개발이 가능하며, 여러가지 장점이 있고 점차 발전해왔다는 점은 좋지만 ... 단점이라면 초기 세팅할게 너무 많다. 1. Homebrew 설치 Homebrew : MAC/Linux에서 패키지를 설치하고 관리할 수 있는 맥용 패키지 관리자 ## 설치여부 및 버전 체크 $ brew --version ## 설치하기 $ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" homebrew 사이트에서 복사하여 설치 가능 참고로, 기존 Homebrew 경로는 Intel칩 기준이라, /opt 경로로 바꿔줘야 한다고 한다. 아래 명령어도 입력해준다. #..