리액트가 없다면?
<html> <body> <header> <h1>WEB</h1> world wide web! </header> <nav> <ul> <li><a href="1.html"></a>HTML</li> <li><a href="2.html"></a>CSS</li> <li><a href="3.html"></a>Javascript</li> </ul> </nav> <article> <h2>HTML</h2> HTML IS HyperText Markup Languge. </article> </body> </html>
위의 코드가 있다고 가정 했을때 이 코드가 단순히 한줄이 아니라
1억줄이라고 가정해보자. 그러면 우리는 한눈에 이 코드를 읽을 수 없다
그런 상태에 있을 때 우리는 이런 상상을 할 수 있을 것이다.
저 1억줄의 코드를 안보이게 감춰놓고 이름만 넣어 둘 수 있다면 얼마나 좋을까?
<html> <body> <subject></suvject> <nav> <ul> <li><a href="1.html"></a>HTML</li> <li><a href="2.html"></a>CSS</li> <li><a href="3.html"></a>Javascript</li> </ul> </nav> <article> <h2>HTML</h2> HTML IS HyperText Markup Languge. </article> </body> </html>
젤 위의 header가 작성되 있던 곳에 subject라는 제목만 있는 태그(Component)를 입력해놓고
그 안의 실제 내용이 담긴 코드는 다른곳에 숨길 수 있는 것
그것이 바로 리액트가 할 수 있는 일이다.
Component를 통해서 분리하는 것이다.
그렇게되면 가독성이 좋아지고 재사용성 또한 높아진다.
다음 파트에서 Component는 어떻게 생성하고 어떻게 사용하는지 알아보자
꾸준함을 잃지 말자는 모토를 가지고 개발하고 있습니다 :)