컴포넌트(component)를 직역하면 ‘구성 요소’라는 의미입니다. 프런트엔드 개발에서의 컴포넌트는 유저 인터페이스를 구성하는 요소라고 이해하면 됩니다. 리액트로 프런트엔드를 개발할 때는 수많은 컴포넌트를 만들면서 진행하게 되는데요. 리액트에서의 컴포넌트는 단순히 보이는 부분만 담당하는 것이 아니라, 사용자가 어떠한 행동을 취했을 때 어떠한 작업을 할지도 설정해줄 수 있습니다.

1장에서 수정한 App.js 파일을 다시 열어보세요.

App.js

import React from 'react';
import {SafeAreaView, View, Text} from 'react-native';

const App = () => {
  return (
    <SafeAreaView>
      <View>
        <Text>Hello React!</Text>
      </View>
    </SafeAreaView>
  );
};

export default App;

여기서 App이 바로 컴포넌트입니다. 그리고 App 컴포넌트 안에는 또 다른 다양한 컴포넌트가 들어있죠.