[React] React 란?

React 공식 웹사이트를 가면 React를 한 문장으로 잘 설명하고 있다.

A JavaScript library for building user interfaces

웹 페이지를 만들기에는 html, css, javascript만 있어도 충분하지만 React를 활용하면 유저 인터페이스를 좀 더 쉽고 효율적으로 만들 수 있기 때문에 많은 사람들이 자바스크립트 라이브러리인 React를 사용한다.

React 특징

• Declarative (선언형): 선언형은 How(어떻게) 보다는 What(무엇)을 더 중요하게 생각한다. 어떤식으로 코드를 작성해서 원하는 결과를 얻는지 모든 과정을 작성하지 않고 무엇을 원하는지를 작성한다.

  // 주어진 배열에서 5 보다 작은 요소들만 골라서 새로운 배열을 만들고 return 해준다.
  // 코드 내용을 보면 (How) 어떻게 5보다 작은 요소들을 골라낼지 과정을 보여준다.
  // 이러한 방식을 명령형 프로그래밍 (Imperative Programming) 이라고도 한다.
  function lessThanFive(arr){
    let result = [];
    for(let i = 0; i < arr.length; i++) {
      if(arr[i] < 5){
        result.push(arr[i]);
      }
    }    
    return result;
  }​
  
  // 위와 같은 함수를 구현했지만 
  // 여기서는 filter 라는 메서드를 사용해서 이 함수가 무엇을 하고 있는지를 보여주고 있다.
  // 이러한 방식을 선언형 프로그래밍 (Declarative Programming) 이라고도 한다.
  function lessThanFive(arr){
    return arr.filter(elem => elem < 5);
  }​

  선언형은 코드를 읽었을 때 더 읽기가 쉽고 다음에 어떤 일이 발생할지 예측하기가 쉽다.
• Component: Component란 하나의 기능을 구현하기 위해 여러 종류의 코드를 묶어둔 형태 또는 모듈이라고 볼 수 있다. 다시 말해서 하나의 Component는 한 가지의 기능만을 가지고 있다. 각각의 Component들은 독립적이어서 재사용에 용이하고 만약 버그가 생긴다면 해당 Component만 수정하면 되기 때문에 유지보수가 쉽다.
• 범용성: React는 라이브러리이기 때문에 기존 프로젝트에서도 유연하게 적용할 수 있다.