[ React기초 ] React 설치

리액트 설치 순서

1. 리액트 설치순서
   • Node.js 최신버전 설치
   • 비쥬얼 스튜디도
   • 작업폴더 reactTest 생성 (blog폴더생성)
   • 비쥬얼스튜디오 터미널 오픈

npx create-react-app blog (명령어 입력) 

• npx: 라이브러리 설치 명령어 (node.js 설치 되어야 이용가능)
• create-react-app: 리액트 도와주는 라이브러리
• blog 라는 이름의 리액트 프로젝트 만들겠다
  -> reacttest폴더안에 blog프로젝트 생성 (리액트파일 다 설치)

2. blog 하위폴더 오픈 (file open으로 오픈)

• src > App.js 메인페이지 (= index.html동일 여기서 코딩시작)
• 미리보기: npm start (개발 서버 Live로 보여줌, App.js 기본페이지 띄어짐)

[ 상세 설명 ]

1. Node.js설치 이유
   • create-react-app라이브러리를 사용하기위해 설치 (npm , npx를 위해)
   • node.js 설치하면 npm이 딸려옴 , 라이브러리설치할때 도와주는 npm이라는 툴을 이용할 수 있다.
     -> create-react-app 라이브러리를 사용했다.
   • npm 유용한 점 찾기
2. App.js는 메인페이지에들어갈 html내용..
   • public > index.html 실제 메인페이지 App.js에 있는걸
   • App.js에 있는걸 index.js에서 넣는다...(js정통문법 사용)

const root = ReactDOM.createRoot(document.getElementById('root'));
		root.render(
		  <React.StrictMode>
			<App />
		  </React.StrictMode>
		);

[ 리액트 폴더 구조 ]

- node_modules: 라이브러리를 모은 폴더
- public: static파일들 보관함 
- src: 소스코드 보관함 
- package.json: 설치한 라이브러리 목록으로 npm으로 라이브러리 설치할때마다 자동으로 빌드됨