사이드 프로젝트 with React 28. 기술셋 선정하기 -프론트엔드

 

3/19 (SUN)

들은 강의: Part 3. 프로젝트 설계하기 02. 기술셋 선정하기 (1) - 프론트엔드

 

기술셋 선정하기 - 프론트엔드

 

1. 시스템의 요구사항을 잘 충족시키기 위해 필요한 것들 리스팅

 

• 페이지 라우팅
• UI 코드 재활용 가능
• 상태관리가 가능한가?
• 테스트 코드 작성 용이
• 개발 커뮤니티 활성화
• 기술의 안정성 - 나온지 얼마 안 된 너무 새로운 기술은 X. 안정된 버전이 있고, 유지보수 하는 단체가 안정적인가?
• 팀 내 기술 친숙도
  • 💡 기술 친숙도 만으로 기술을 결정하는 요소가 될 수는 없다. 하지만 후보군들이 다 비슷비슷할 경우 기술 친숙도로 결정할 수 있다.

 

2. 후보군 조사

 

• React.js
• Angular
• Vanilla JS

 

3. 비교 테이블 생성

 

React Angular Vanilla

 

페이지 라우팅
UI 코드 재활용 가능
상태 관리 가능
테스트 코드 작성 용이
개발 커뮤니티 활성화
기술의 안정성
팀 내 기술 친숙도

 

4. 비교/분석 하기

 

React / Angular / Vanilla

 

	React	Angular	Vanilla
페이지 라우팅	O -> React-router를 이용하여 가능	O -> 내장 기능	X -> 직접 구현
UI 코드 재활용 가능	O -> 컴포넌트	O -> 컴포넌트	X
상태 관리 가능	O -> Redux / Recoil 을 통해 가능	O	O -> Redux를 통해 가능
테스트 코드 작성 용이	O -> 테스트하고자 하는 해당 컴포넌트만 import 하면 됨	X ->  컴포넌트에서 의존하는 모듈 및 자식 컴포넌트들을 일일히 명시해야 함	X -> 리액트에 비해서..?
개발 커뮤니티 활성화	O	O	X
기술의 안정성	O	O	O
팀 내 기술 친숙도	상대적	상대적	상대적

 

+ 리액트의 인기가 압도적으로 많아서 새로운 프론트엔드 개발자가 오더라도 리액트를 알고 있을 확률이 높다.

 

 

5. 결정

 

React + React-router + Recoil

 

(이번 프로젝트에서는) 왜 Redux보다 Recoil인가?

 

1. Redux는 Recoil에 비해 러닝 커브가 훨씬 높다.
2. Recoil은 React 전용 상태 관리 라이브러리.
3. Recoil은 React 스타일의 hook을 제공함.

 

대규모 상태를 관리해야 하는 프로젝트에는 redux를 사용하는 것이 좀 더 적합하다. 

또한 이런 대규모 상태를 감시, 디버깅하기 위한 안정적인 'devtool'도 가지고 있기 때문에 안정성 면에서도 redux가 더 낫다.

그러나 지금 진행하려는 프로젝트는 대규모 데이터를 다루는 것도 아니고, 기한이 길지 않은 프로젝트이기 때문에 상대적으로 적은 코드를 작성하는 recoil이 redux에 비해 유리할 것이다.

 

 

 

 

#패스트캠퍼스 #패캠챌린지 #수강료0원챌린지 #환급챌린지 #직장인인강 #직장인자기계발

#패캠인강후기 #패스트캠퍼스후기 #오공완 #사이드프로젝트10개기술스택으로구현하는풀스택서버리스프로젝트withReact

 

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성되었습니다.

 

 

http://bit.ly/3Y34pE0

패스트캠퍼스 [직장인 실무교육]