컴포넌트(Components)

React는 사용자 인터페이스를 구축하는 JavaScript 라이브러리입니다.

 

이런 라이브러리를 사용하는 이유는 조금 더 간단하게 사용자 인터페이스를 구축할 수 있기 때문입니다.

 

React를 사용하면 작업은 훨씬 더 수월해지고 아주 사소한 것들에 신경 쓸 필요도 없어지며, 오류도 덜 발생할 것입니다.

 

이렇게 작업을 조금 더 단순하고 간단하게 하기 위해 React는 컴포넌트라는 중요한 개념을 사용합니다.

 

 

 

 

컴포넌트

다양한 사용자 인터페이스는 컴포넌트로 구성됩니다. 

인터페이스를 구성하는 똑같은 형태의 틀에서 다른 데이터를 보이게 되는 것을 컴포넌트라고 할 수 있습니다.

 

위의 이미지로 예를 들면 같은 틀, 즉 네모난 틀에 각각 다른 글이 들어가 있는데 이것을 컴포넌트라고 합니다.

 

컴포넌트는 사용자 인터페이스에서 재사용할 수 있는 빌딩 블록이기 때문에 스타일을 만드는 Html코드와  CSS 코드, 로직을 위한 JavaScript의 결합입니다.

 

이런 각각의 컴포넌트를 구축하고 React에 최종 사용자 인터페이스에서 어떻게 구성할 것인지 명령을 해주면 됩니다.

 

 

 

컴포넌트 사용 이유

React에서 컴포넌트 개념을 사용하는 이유는 재사용 가능하다는 점뿐만 아니라 우려사항들을 분리할 수 있도록 해주기 때문입니다.

 

이 두가지 개념은 일반적으로 프로그래밍에서 중요한 개념입니다.

 

재사용 가능한 빌딩 블록은 반복을 피할 수 있게 해 주는데 프로그래밍에서 반복하지 않는 것이 좋기 때문입니다.

 

우려사항들을 분리하는 것은 코드 베이스를 작고 관리 가능한 단위로 유지할 수 있게 해줍니다.

 

모든 Html 코드와 모든 JavaScript 로직, 그리고 전체 사용자 인터페이스가 들어있는 커다란 파일 대신 각각의 컴포넌트는 하나의 명확한

 

과제에 대해서만 집중할 수 있습니다.