부스트코스 강의 웹 프론트엔드 시작하기 (리액트&리덕스)
중 '40강 챕터를 마치며'를 참고해 작성한 내용이다.

immutable-js

• 앱이 복잡해지면 의도하지 않은 값의 변경은 혼란을 불러온다.

• immutable-js: 배열과 객체를 immutable하게 다루기 위한 대표적인 라이브러리

• 모든 연산이 원본을 변경하지 않고 복제된 원본을 변경한 결과를 리턴한다.
  

React Router

• React로 만든 웹 앱은 하나의 url로 모든 페이지를 다룬다.

• 페이지를 전환할 때 마다 네트워크 로딩을 하지 않는 다는 점은 장점이지만, url로만 페이지를 찾아올 수 없다는 것이 단점인데, 이 문제를 해결해 url에 따라 다른 UI가 나오게 해주는데 도움을 주는 도구가 React ROuter이다.

• url에 따라 적당한 컴퍼넌트가 실행되게 하고, url로 접근하는 사용자에게는 그 url에 해당되는 UI를 서비스할 수 있는 permalink 기능도 제공한다.

• npm 등을 통해 설치해 사용할 수 있다.

create-react-app

• npm run eject를 실행하면 여러 설정을 추가로 수정할 수 있게 된다.

• 마음대로 개발 환경을 수정할 수 있지만 한번 eject를 하면 다시 돌아갈 수 없다.

Redux

• React의 컴퍼넌트가 많아지면 컴퍼넌트들 간 교류가 까다로워진다.

• 부모가 자식에게 데이터를 전달할 때는 props를 따라가야 하고, 자식이 부모에게 갈 때는 이벤트를 버블링시켜야 하는데, 컴퍼넌트가 매우 많다면 많이 복잡해진다.

• Redux는 중앙에 데이터 저장소를 하나 만들고 모든 컴퍼넌트는 그 중앙에 있는 저장소와 직접 연결된다. 그 저장소에 데이터가 변경되면 그것과 관련된 모든 컴퍼넌트가 같이 변경한다.

React server side rendering

• 서버 쪽에서 웹페이지를 완성한 후 클라이언트로 완성된 HTML을 전송하는 것으로 앱의 구동을 시작할 수 있다.

• 초기 구동 시간을 단축할 수 있고 로딩이 필요없는 앱의 특성은 계속 유지할 수 있다.

• 검색엔진과 같은 로봇들이 html 태그를 직접 읽을 수 있도록 해주기에 웹페이지를 분석하려 하는 로봇에게 친화적인 기술이다.

React native

• React와 같은 방법으로 IOS, 안드로이드와 같은 native 앱을 만들 수 있다.

• 하나의 코드로 거의 모든 플랫폼에서 동작하는 앱을 만들 수 있다.