react 알아보기 (4) - react에서 개발자가 할 것

개발자가 할 것

콘텐츠를 표현하는 html 마크업과 css 작성

import 문과 export 문 작성

function App(){...}과 return 문을 작성하는 것

 

 

App.js 파일에 코드를 작성한 후

npm start를 실행하면 react가 html 마크업과 css로 콘텐츠를 표현한다.

 

 

아래는 App.js의 기본 화면(기본 틀)

import logo from './logo.svg';

import './App.css';

function App() {

return (

<div className="App">

<header className="App-header">

<img src={logo} className="App-logo" alt="logo" />

<p>

Edit <code>src/App.js</code> and save to reload.

</p>

<a

className="App-link"

href="https://reactjs.org"

target="_blank"

rel="noopener noreferrer"

>

Learn React

</a>

</header>

</div>

);

}

export default App;

 

이렇게 브라우저에 출력