[React] React app 파일 구조

🍮 react app 파일구조

 

 

SIMPLEROUTE라는 폴더에 만든 리액트앱의 구조이다.

node_modules, public, src, package.json, package-lock.json, README.md로 이루어져 있다.

 

 

node_modules는 너무 많아서 펼치진 않았지만 모듈들이 들어있다.

모듈 추가할 때 게시물에 적었던 파일이다.

public에는 많이 만지지 않았던... index.html과 리액트 아이콘 사진파일이 들어있다.

manifest.json은 뭔지... 모르겠다.

 

 

src에는 App.js이 들어있는데 여기서 주로 앱구성을 한다.

src폴더가 주된 코드를 짜는 파일이 많은 폴더이다.

App.js에서 export default App을 하고 있다.

이것을 index.js에서 import하여 렌더링에 사용할 것이다.

 

 

document.getElementById('root')로 index.html의 id가 root인 요소를 불러냈다.

dom을 사용하고 있는 듯 하다.

.render은 어떤 메서드인지는 모르지만 요소를 받아서 그것들을 root의 하위요소로 랜더링해주는 것 같다.

index.html에서 id가 root인 div요소를 볼 수 있다.