Angular, Vue와 함께 많이 쓰이는 ReactJS!
AngularJS(1)의 경우 코드카데미 강의 pro과정을 듣고 프로젝트를 진행해보았는데,
Angular4로 많이 바뀌어서 이번엔 리엑트를 배워보기로 하였습니다.
감사하게도 좋은 강의들이 많더라고요. (하단 참고)

ReactJS란!

• 웹 애플리케이션을 만들 때 클라이언트 사이드를 구조화 하기 위한 프레임워크, 라이브러리들 중 하나로 Angular, Vue등과 함께 가장 많이 쓰인다.
• ReactJS는 UI(User Interface)를 만들기 위한 라이브러리 즉, View를 담당한다.
  • Model, View, Controller 중 View!
• 프레임워크(예: Angular)와는 달리 Controller, Router, Ajax 등의 기능을 내장하고 있지 않다.

여기서 잠깐! Framework와 Library의 차이점
Framework : 필요한 기능이 대부분 만들어져 있는 틀. 이 틀을 채워넣어서 완성한다.
틀에서 벗어나기가 좀 어렵다. 가끔 다른 라이브러리 등과 사용시 충돌할 수도 있다.
상황에 따라 무겁게 느껴질 수 있다.
Library : 필요한 곳에 가져다 쓰는 개념. 다른 라이브러리와 충돌할 염려가 없다.

ReactJS의 핵심 - Virtual DOM(가상돔)사용

처리해야할 데이터가 많아질 때 실제 DOM처리시 성능 느리고, 비효율적, 관리하기 힘들다.
Virtual DOM은 이를 추상화시킨 것으로 JS객체에 불과하다. 실제 DOM API를 사용하는 것보다 훨씬 빠르다.

ReactJS의 장점

• JavaScript기반이므로 다른 언어를 배우지 않아도 된다.
• Virtual DOM 사용
• 컴포넌트 개념만 사용하여 복잡하지 않다.
  • 뛰어난 UI 재사용
• 뛰어난 gabage collection, 메모리 관리, 성능
• 서버사이드와 클라이언트사이드 렌더링을 모두 지원한다.
  • 서버사이드에서 초기에 렌더링을 해주면 초기 구동 딜레이를 줄일 수 있다.
  • 서버사이드 렌더링을 하면 SEO(검색엔진최적화)를 할 수 있다. 클라이언트 렌더링만 할 경우 초반에 데이터가 없는 상태이다.(구글은 되지만)
• 다른 프레임워크, 라이브러리와 함께 사용 가능. 특정 부분에만 사용이 가능하다.
• 페이스북이 밀어준다.
• 단방향 데이터 플로우 (Data변경되면 -> UI 변경됨)

ReactJS의 단점

• IE8 이하는 지원하지 않는다.

참고 사이트 & 리엑트 강의들
인프런 무료강의
노마드코더 youtube강의
유데미 인기강의 한글자막 : 90% 할인될때를 노려봅니다. ㅋㅋ