Concepts Hello, World!
페이지 정보
본문
터미널에서 npx create-react-app으로 app을 생성하면
index.html, index.js, app.js 등은 물론 필요한 디렉토리와 파일등이 자동으로 생성된다.
생성된 src 디렉토리에 concepts.js 파일을 생성하고 다음과 같이 입력한다.
function Concepts() {
return (
<h1>Hello, world!</h1>
);
}
export default Concepts;
그전에 index.js를 다음과 같이 수정한다.
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import Concepts from './concepts'; // concepts.js 파일 임포트
ReactDOM.render(
<React.StrictMode>
<Concepts />
</React.StrictMode>,
document.getElementById('root')
);
그리고 터미널에서 해당 디렉토리로 이동
해당 디렉토리에서
npm start...
기본 브라우저의 로컬호스트가 실행된다.
(* 참고 : 동일한 LAN이라면 http://172.30.1.48:3000 으로 스마트폰에서도 접속 가능하다)
결과화면
