[React Native] 핵심 구성 요소 및 기본 구성 요소

React Native는 React와 앱 플랫폼의 네이티브 기능을 사용하여 Android 및 ios 애플리케이션을 구축하는 오픈 소스 프레임워크입니다. React Native를 사용하면 Javascript를 사용하여 플랫폼의 API에 액세스하고 React 구성 요소를 사용하여 UI의 모양과 동작을 설명할 수 있습니다.

뷰와 모바일 개발

안드로이드 및 ios 개발에서 view는 UI의 기본 블록입니다. 화면의 작은 직사각형 요소로 텍스트를 표시하거나 이미지를 표시하거나 사용자 입력에 반응할 수 있습니다. 앱의 가장 작은 시각적 요소조차도 텍스트 한 줄이나 버튼과 같은 종류의 뷰입니다. 일부 뷰는 다른 뷰를 포함할 수 있습니다. 뷰는 계속 중첩될 수 있습니다.

네이티브 구성 요소

안드로이드 개발에서는 코틀린이나 자바로 뷰를 작성하고 ios개발에서는 swift나 object-c를 사용합니다. react native를 사용하면 javascript를 사용하여 이러한 뷰를 호출할 수 있습니다. 런타임 시 react native는 해당 구성 요소에 대해 안드로이드 및 ios 뷰를 생성합니다. react native 구성 요소는 안드로이드 및 ios와 동일한 뷰를 기반으로 하기 때문에 react native 앱은 다른 앱처럼 보이고, 느껴지고, 작동합니다. 이러한 플랫폼 지원 구성 요소를 네이티브 구성 요소라고 합니다.

react native는 필수적이고 바로 사용할 수 있는 네이티브 구성 요소 세트를 제공하여 오늘 바로 앱을 구축할 수 있습니다. 이러한 구성 요소들은 react native의 핵심 구성 요소라고 합니다.

react native는 안드로이드 및 ios에 맞춰 자체 네이티브 구성 요소를 만들 수 있도록 해줍니다.

핵심 구성 요소

RN 구성요소	ANDROID 뷰	IOS 뷰	WEB 유사 요소	설명
<View>	<ViewGroup>	<UIView>	<div>	레이아웃을 플렉스 박스로 지원하고, 스타일링, 일부 터치 핸들링 및 접근성 제어가 가능한 컨테이너
<Text>	<TextView>	<UITextView>	<p>	문자열 텍스트를 표시, 스타일링 및 중첩할 수 있으며 터치 이벤트도 처리 가능
<Image>	<ImageView>	<UIImageView>	<img>	다양한 유형의 이미지를 표시
<ScrollView>	<ScrollView>	<UIScrollView>	<div>	여러 구성 요소와 뷰를 포함할 수 있는 일반적인 스크롤 컨테이너
<TextInput>	<EditText>	<UITextField>	<input type='text'>	사용자가 텍스트를 입력할 수 있음