React란?

📍 React란

페이스북에서 제공하는 컴포넌트 기반의 프론트엔드 라이브러리이다.

• HTML, CSS만으로는 동적 데이터를 UI에 뿌려주기 적합하지 않지만, 리액트는 사용자와 상호작용을 할 수 있는 UI를 손쉽게 만들 수 있기 때문에 리액트를 사용한다.

💡 Augular와 React의 차이점
Augular는 뷰레이어를 포함해 많은 기능을 갖춘 완전한 프레임워크이지만, React는 웹을 만드는데 필요한 도구들이 기본적으로 제공되지 않는 라이브러리이다.

📍 React의 특징

• 컴포넌트 기반의 라이브러리
  => 각각의 기능을 컴포넌트로 따로 만들고, 하나의 컴포넌트로 묶어서 관리가 가능 (코드의 재사용성과 유지보수성이 증가)

• 단방향 데이터 바인딩
  => 리액트 데이터 흐름은 한 방향으로만 흐른다.

• Props and State
  => Props: 부모 컴포넌트에서 자식 컴포넌트로 전달해주는 데이터이다. 자식 컴포넌트에서 받은 props는 변경이 불가능하고 props를 전달한 최상위의 부모 컴포넌트에서만 데이터 변경이 가능하다.
  => State: 사용자와의 상호작용을 통해 데이터를 동적으로 변경해야 하는 것 처럼, 동적인 데이터를 다룰 때 사용한다. state는 독립적이라 다른 컴포넌트에서 직접적인 접근이 불가능하다. 하지만 state를 변경하는 함수 setState()를 props로 받는다면 변경이 가능하다.

• VirtualDOM
  => 가상의 DOM으로 실제 DOM을 조작하는게 아닌, 추상화 한 자바스크립트 객체르르 구상해 사용한다.

📍 React의 장점

• 배우기가 간편하고, 애플ㄹ리케이션을 만들 때 복잡함이 덜하다,

• 분리를 하지 않고 Component 하나로 관리한다. (재사용이 용이함)

• 서버사이드 렌더링과 클라이언트 렌더링을 둘다 지원한다.

• 다른 프레임워크나 라이브러리와 혼용하여 사용이 가능하다. 따라서 개발이 완료된 서비스에도 적용이 가능하다.