[React] Study #2 | Component, 컴포넌트!

1️⃣ 컴포넌트 하나 만들어보기

import react from 'react';	// 리액트 불러오기

function Hello() {
    return <div>안녕하세요</div>
}

export default Hello;	// Hello 라는 컴포넌트로 내보내겠다!

 

리액트 컴포넌트 종류

• 함수형 : 내가 블로그에 작성하고 공부하면서 쓸 컴포넌트 형태임!
• 클래스형 

 

export default Hello; 

• 다른 컴포넌트에서 불러와서 사용가능

 

2️⃣ App.js에서 Hello 컴포넌트 불러오기

import React from 'react';  //리액트 불러오기
import Hello from './Hello';  //Hello 컴포넌트 불러오기

function App() {
  return (
    <div>
      {/* 적용! */}
      <Hello /> 
    </div>
  );
}

export default App;

-> 이런식으로 재사용이 가능!

---

Reference

https://react.vlpt.us/