리액트의 필요성

위 코드는 리액트의 필요성을 설명하기 위해 만든 코드다.

 

(본문의 내용과 관련이 없을 수 있겠지만, 위 코드에 쓰이는 <header>태그를 잠깐 설명하자면 기능상으로는 영향을 끼치는 것이 없다. 그렇지만 코드를 읽기 쉽게 여기가 header라는 것을 알려주기 위해 사용한다. <nav>와 <article>태그도 마찬가지다)

 

만약에 사진 속에 있는 <header>태그 안의 코드가 정말 많은 양의 코드로 이루어져있다고 하자. 

마찬가지로 <nav>태그 안의 내용과 <article>태그 안의 내용도 몇 만줄이 되는 코드로 이루어져 있다고 하자. 

그 결과는 코드를 읽기가 어렵고 혼란스러운 상태가 될 것이다.

이때 코드를 읽을 때는 <header>, <nav>, <article> 태그를 숨겨놓았지만, 웹 페이지 상에는 그 내용의 코드가 있다면 편할 것이다.

 

예)

 

예를 들면 위와 같은 것이다. 정말 긴 <header>태그와 그 내용이 있다고 하고, 그것에 따로 이름을 붙여 <subject>라는 태그로 대체한다고 하자. 

매우 긴 <header>태그 내용은 코드 상에서 보이지 않게 된다. 그래도 웹 페이지에서는 긴 <header> 태그 내용이 그대로 담겨있다. 이렇게 할 수 있다면 매우 편할 것이다.

이것을 가능하게 해주는 것이 리액트다.