3.2.3.2 모듈 불러오기(import)

이번에는 App 컴포넌트에서 MyComponent 컴포넌트를 불러와서 사용해 봅시다. 기존에 App 컴포넌트에 있던 코드를 모두 지우고 다음과 같이 새로 작성해 보세요.

App.js

import React from 'react';
import MyComponent from './MyComponent';
 
const App = () => {
  return <MyComponent />;
};
 
export default App;

---

 

위 코드에서 import 구문을 사용하는 두 번째 줄은 우리가 만든 MyComponent 컴포넌트를 불러옵니다. 코드를 저장하고 브라우저에서 다음과 같이 렌더링되었는지 확인해 보세요.

▲ 그림 3-5 MyComponent를 불러와 렌더링하기