3. 왜 "JavaScript" 대신 리액트 일까요?

 

자바스크립트를 이용해서 모달 창을 열고 닫는 과정을 작성해 보았다

모든 단계를 일일이 작성해야 하는 번거로움이 있다.

예제에서는 한 가지의 창 밖에 없었지만, 저 메인 화면에 있는 모달창이 여러 개라면 같은 작업을 여러 번 반복해야 하는 과정이 분명 존재하게 될 것이다.

 

명령형 접근 방식
일일이 코드에 대해서 반복적은 설명을 해야 하게 될 것이다

 

반대로 리액트를 이용해서 같은 기능을 만든다면
React.js가 파일이 더 많고 복잡해 보이는 듯 하지만 

위와 같이 Todo 컴포넌트를 이용할  수 있다

여기에서 리액트에서 가장 중요한 개념 중에 하나인 컴포넌트가 등장한다.

리액트는 응용 프로그램을 작은 빌딩 블럭과 작은 컴포넌트들로 분할하는 것으로, 모든 빌딩 블럭, 컴포넌트들은 명확한 Task를 갖고 있으며, 코드는 유지보수가 용이하도록 만들어진다.

리액트에서 라이브러리는 코드를 조합해서 화면에 무언가를 렌더링하는 제일 중요한 작업을 할 것이다

 higher level syntax 

선언형 방식, 선언형 컴포넌트 중심의 방식으로 코드를 작성한다

 

즉 간단한 컴포넌트를 만들고 아래와 같이 text와 같은 속성의 값만 다르게 주면 화면에 그 값을 이용해서 출력할 수 있게 되는 아주 편리하고 관리하기 유용한 기능이라고 할 수 있다