프론트에서 필요한 데이터를 미리 준비하자 컴포넌트를 어떻게 구성할지 생각하자 상태바의 크기는 react-native-iphone-x-helper로 구할 수 있다. -> 아카이빙됨. getBottomSpace, getStatusBarHeight로 구해서 이만큼 패딩주면됨 react-native-safe-area-context를 사용하자. 아이콘은 @expo/vector-icons를 사용하자. 패딩, 마진값을 보고싶으면 백그라운드 컬러를 이용하자. react-native-safe-area-context를 사용하여 상태바 크기 구할 수 있다. https://github.com/th3rdwave/react-native-safe-area-context 로 를 감싸서 사용한다. 에 안전한 영역으로 사용할 부분을 e..

컴포넌트를 어떻게 나눌 수 있을까 고민하자. flexDirection row: 가로 column: 세로 클래스 컴포넌트에서 props 접근은 this.props로 접근한다. 커스텀 훅 - 커스텀 훅은 이름이 use로 시작해야한다. - value, setValue, resetValue 3가지를 리턴한다. import React, {useState} from 'react' import {View, TextInput, Button} from 'react-native' const InputBox = (props) => { return } // Custom Hook const useInput = (initialValue) => { const [value, setValue] = useState(initialValu..

컴포넌트: 재사용 가능한 객체 props: 부모 컴포넌트가 자식 컴포넌트에게 전달하는 데이터 -> 읽기전용이므로 자식이 변경 불가능. 변경하고 싶으면 state 사용 컴포넌트 1. 클래스형 - class 키워드 필요 - Components 상속 필요 - render 메소드 필요 2. 함수형 -> 추천 - state, lifeCycle은 hook으로 사용해야함 - 클래스보다 메모리 사용 적음 - 컴포넌트 선언이 편함 - 공식문서에서는 함수형 + hook 사용을 권장

https://reactnative.dev/docs/components-and-apis Core Components and APIs · React Native React Native provides a number of built-in Core Components ready for you to use in your app. You can find them all in the left sidebar (or menu above, if you are on a narrow screen). If you're not sure where to get started, take a look at the following cat reactnative.dev Basic Components View Text Image Tex..