React vs Vue vs Angular vs Svelte

프레임워크/라이브러리를 살펴 보기에 앞서 간단하게 SPA(Single Page Application)에 대해서 짚어보자.

SPA

Single Page Application 으로 모던 웹의 패러다임이다.

특징은 아래와 같다.

1. 기본적으로 단일 페이지이다.
   따라서 기존의 서버 사이드 렌더링에 비해 배포가 쉽고, 모바일 앱과 같은 UX를 제공한다.
2. 기본적으로 모든 정적 리소스를 최초 한 번만 다운로드 받는다.
   새 페이지 요청 시, 필요한 데이터만 전달 받아 페이지를 갱신한다.
   필요한 부분만 갱신하므로 새로고침이 발생하지 않고 속도도 빠르다.
3. 위의 장점과 더불어 처음에 다운로드 크기가 크므로 초기 속도는 느린 편이다.

---

✅ React vs Vue vs Angular vs Svelte

	React	Vue	Angular	Svelte
	가장 거대한 커뮤니티	상대적으로 작지만 충분한 커뮤니티	큰 커뮤니티	소규모 커뮤니티
	단방향 바인딩	양방향/단방향 둘 다 가능	양방향 바인딩	단방향 바인딩
	Virtual Dom	Virtual Dom	X	X
	X	단일 파일 컴포넌트(Single File Component)	X	X
	라이브러리	프레임워크	프레임워크	라이브러리

라이브러리 vs 프레임워크

• 라이브러리
  라이브러리는 단순 활용가능한 도구들의 집합을 말합니다.
  즉, 개발자가 만든 클래스에서 호출하여 사용, 클래스들의 나열로 필요한 클래스를 불러서 사용하는 방식
• 프레임워크
  프레임워크는 뼈대나 기반구조를 뜻하고, 제어의 역전 개념이 적용된 대표적인 기술

---

🤔 스타트업을 창업한다고 할 때, 무슨 라이브러리/프레임워크를 사용해야 할까?

내 생각은 스타트업일수록 나에게 익숙하고 팀원들에게 익숙한 라이브러리/프레임 워크를 사용해야 한다고 생각한다. 왜냐하면, 일단 스타트업에서는 사용자 유입이 빠르게 진행되어야 하기 때문이다.

---

💡 난 무엇을 위해 React 를 학습하는가?

1. Virtual DOM를 활용하기 위해...!
   기존의 DOM은 페이지가 바뀔 때마다, 새 HTML를 로드하면서 DOM 전체를 바꾸게 되지만, Virtual Dom은 React 컴포넌트가 리턴하는 값에 의해 만들어져서 실제 보이고 있는 DOM과 비교해서 달라진 부분만 찾아내어 바꾼다. 웹 페이지의 속도에 영향을 준다.
   
   
2. React 웹 / React Native의 앱 개발을 위해...!
   요즘은 웹/앱으로 서비스를 많이 출시하고 있다. 때문에 React 하나만 잘 활용하여도 React Native로 native moblie app을 만들 수 있다.