[react] 리액트 기초 (index, src, public)

public

가상 DOM을 사용하는 리액트는 실제 DOM이 필요하다. 즉, 가상 DOM이 들어갈 빈 껍데기 html이 필요하다는 것인데, 바로 그 껍데기가 존재하는 폴더.

src

리액트 개발이 이루어지는 메인 폴더. 앞으로 우니는 src폴더를 주로 수정하고 src폴더에 있는 파일들을 작성할 것이다.

 

render() 메소드

리액트 컴포넌트로 화면에 html뷰를 생성해주는 역할을 한다. return으로 받은 값들은, 나중에 html 코드로 바뀌게 된다.

그렇게 생성된 App 클래스를 export문법을 이용해 내보낸다.

 

고찰

index.js에서 App을 불러와 사용할 때에 html코드를 사용하는걸 (<App />) 볼 수 있는데, 모든 리액트 파일들은 전부 html 코드처럼 사용할 수 있다. 즉, html코드를 여러 개의 리액트 파일로 분할해서 작업할 수 있다는 것. 

-> 협업도 쉬워지고, 코드의 수정도 특정 부분만 하기 때문에, 이점이 많아진다.

 

출처

medium.com/wasd/%EA%B8%B0%EC%B4%88%EB%B6%80%ED%84%B0-%EB%B0%B0%EC%9A%B0%EB%8A%94-react-part-3-a76a727447d3

기초부터 배우는 React — Part 3