React - Intro
1.Web Application의 발전
- 배경 : 브라우저의 UI,UX요소의 중요성이 커지면서 애플리케이션의 규모가 커졌고 다양한 UI,UX요소를 구현하기 위해 기존의 방식(DOM, JQuery)으로 애플리케이션을 개발하고 코드 유지보수하는 것이 어려워짐
ref) JQuery도 결국 DOM에 쉽게 접근해 조작을 가능하게 하는 메소드의 모음
- 규모가 커지고 복잡한 애플리케이션을 개발하고 많은 양의 데이터 관리와 유지 보수를 편하게 하기 위해 다양한 Frontend Framework(Library) 등장
그 중 가장 많이 쓰이는 세가지가 Angular, Vue, React
2.Framework VS Library
FrameWork
- 뼈대나 구조를 뜻하며 소프트웨어에서는 특정 문제를 해결하기 위해서 상호 협력하는 클래스와 인터페이스의 집합이다
개발자가 프레임워크 안에 들어가서 만든 코드를 호출한다
Library
- 단순 활용 가능한 도구들의 집합
개발자가 만든 클래스에서 호출하여 사용
Framework vs Library
- 이 둘의 차이는 제어 흐름에 대한 주도성이 누구에게/어디서에 있는가에 있다
즉 어플리케이션의 Flow(흐름)을 누가 쥐고 있는냐에 달려있다!
**프레임워크는 전체적인 흐름을 스스로가 쥐고 있으며 사용자는 그 안에서 필요한 코드를 짜 넣으며 반면에 라이브러리는 사용자가 전체적인 흐름을 만들며 라이브러리를 가져다 쓰는 것이라고 할 수 있다
프레임워크는 가져다 쓰기 보다 거기에 들어가서 사용한다는 느낌인 반면 라이브러리는 가져다 사용하는 느낌!
3.Angular vs Vue vs React
3-1. Angular
- Google에서 개발(2010)
- TypeScript 기반으로 매우 안정적이고 탄탄한 Frontend App 개발 가능
- Framework의 성격이 강함 (다양한 기능이 내장되어있음)
- 무겁고 배우기 어렵다는 단점
3-2. Vue
- Evan You라는 개인이 개발(2014)
- 코드가 깔끔하고 배우기 쉽기 때문에 가장 나중에 생겼지만 성장 속도가 빠름
3-3. React
- Facebook에서 개발(2013)
- “지속적으로 데이터가 변화하는 대규모 애플리케이션 구축하는 것이 목표” - facebook
- Angular, Vue와 다르게 React는 오로지 View만 담당
cf. MVC(Model-View-Controller) Architecture (ex. Angular, Vue)
Library의 성격이 강함 - 오로지 View에만 신경쓰며 나머지 기능은 third-party 라이브러리 사용(ex. React-router, Redux)
생태계 활성화, 다양한 자료, 그리고 React Native의 출현으로 인해 사용가 많아짐
